Skip navigation.

exploreopera

| Help

Sign up | Help

PABHA

Enhancing Life with Art

CSS code

Could any one tell me what code do I have to put in the CSS if I wish to have the background picture of header from left to right?


Note: Thank you all for yout help. I have finally be able to get it right on Christmas eve. :smile:

New Painting - TranquilityOil Painting - Self Portrait

Comments

avatar
Hi, is the image 950 pixels wide? I know very little about CSS (I had to ask Words for help when I wanted to change my banner) but I cannot see why it would be only on the right if it's a sufficient size. :confused:

Nice picture by the way :smile:

By SittingFox, # 20. December 2007, 19:07:07

avatar
Presently my image is 2040(W) x 408 (H) pixels.
I have uploaded another same image of 918 x 210 px.


By pabha, # 20. December 2007, 23:30:26

avatar
Well, this is the CSS I use (obviously you'll need to put in the link to your own banner):

#top2 {
height:192px;
background: #666633 url(http://files.myopera.com/SittingFox/files/Blogbanner4.jpg) left no-repeat;
}

By SittingFox, # 21. December 2007, 07:28:13

avatar
I tried as per your css. Same result. :worried:

By pabha, # 21. December 2007, 10:43:35

avatar
Er...that's weird. :confused: Perhaps omit the height line? It might be automatically resizing it.

By SittingFox, # 21. December 2007, 10:53:55

avatar
You have to upload your desired picture into your 'files'. From your account, look on the right sidepanel for 'files', then click on 'upload files' locate you banner picture, upload it to ' files'

By lvee, # 23. December 2007, 16:13:11

avatar
Thanks Jacek and Ivee,

I uploaded my picture on 'files' now and have re-done the code, now it look like above.

I think because presently the height of the picture is 210px, it becomes too tall, it goes beyond the 'button bar'.

May be I have to make picture size to be 920 pixels by 170 pixels as per Jacek's above link mentioned.

By pabha, # 24. December 2007, 02:06:46

avatar
#top2 {
height:210 px;
}

copy & paste

By J.es, # 24. December 2007, 02:11:01

avatar
#top {background:url(http://files.myopera.com/pabha/files/aa567.JPG) no-repeat !important;
}

#top2 {
height:210 px;
}


Now the code is as above at CSS. There seems no change from my computer screen even I click the reflesh button.

By pabha, # 24. December 2007, 02:18:30

avatar
#top {background:url(http://files.myopera.com/pabha/files/aa567.JPG) no-repeat !important;
height: 210px;
}

#top2 {
height:210 px;
}

try now

By J.es, # 24. December 2007, 02:21:32

avatar
Presently the file size of the image is 918 x 210 px.

By pabha, # 24. December 2007, 02:21:45

avatar
copy & paste

By J.es, # 24. December 2007, 02:22:51

avatar
Copied and pasted. Clicked save also.

By pabha, # 24. December 2007, 02:26:37

avatar
ok F5
done :wink:

By J.es, # 24. December 2007, 02:28:33

avatar
I back to kitchen I have a lot of cooking for tommorow hahhaha

By J.es, # 24. December 2007, 02:29:42

avatar
Merry Christmas. Enjoy

By pabha, # 24. December 2007, 02:41:08

avatar
Your top baner is ok :smile:

By J.es, # 24. December 2007, 02:42:40

avatar
:up: I have finally get it right! :smile:
Thank you all for your help.

By pabha, # 24. December 2007, 08:44:10

avatar
Good Job!! Nice banner!!

By lvee, # 24. December 2007, 14:06:49

avatar
Hi some little hint for your, if the position of the text in your banner is not your wanted. Then put padding into the #top2 brackets like shown below
#top2 {
padding:0 60px 0 580px;
color:#737373;
text-align:justify;
}

You have to adjust the values to your needs.
padding:top right bottom left

Hope this hint was wanted, if not hmmmm sorry.

:smile:

By namedtonowhere, # 7. February 2008, 19:11:23

avatar
Thank you Ivee. :smile:

By pabha, # 8. February 2008, 03:31:43

avatar
Thank you namedtonowhere, for the hint of the position of the text in the banner. I hope to adjust my text next time when I have more time, accordingly,

#top2 {
padding:0 60px 0 580px;
color:#737373;
text-align:justify;
}

I saw your banner at your blog, it is very nice. I like the photo and the position of the text. :smile:

By pabha, # 8. February 2008, 03:38:32

Write a comment

Comment
(BBcode and HTML is turned off for anonymous user comments.)

Please type this security code : f39072

Smilies

October 2008
SMTWTFS
September 2008November 2008
1234
567891011
12131415161718
19202122232425
262728293031