Changing background at top of the page

hi all !
i want to replace the background at the top of the page with my own custom background.
J 2.5 latest
my site: test1.virecodesign.ro
See what i mean in the picture:

bw.jpg

Anyone on this forum?

Hi,

Please edit the background property on the template.css file for the following selector:

Code: Select all

#gkPageTop

that didn't help me. I put a image where you indicated , but you can see the result in the image below. I want to add a banner/background only in the zone that i marked. Hope you understand me.

Untitled-2.jpg

Yes, I understand you, but you did something wrong. Once again - please open the css/template.css file and around line 163. please find the #gkPageTop selector and then please change/put background property for it.

I'm not a coder. I put this

#gkPageTop {
background: #e8e7df url('../images/style1/bg.jpg')
}

Please help me dziudek!

Sorry but when I'm putting this code in the Firebug to this selector it works - please put this code to your page and then I'll check why it is not working.

You can view live site at http://test1.virecodesign.ro/

The background is changed but is the same image as in the body container so you probably don't see it - please change the #gkPageTop background to other image or colour.

Thanks for the advice. Now my problem is the black line from the top is covered by the banner. How do i fix that?

bgline.jpg

In the style1.css please remove the background property for the following selector:

Code: Select all

div.bg

in the style1.css i replaced

Code: Select all

div.bg {
   background: transparent url('../images/stripes.png') repeat-x 0 0;
}

with

Code: Select all

div.bg {
   
}

It didn't work

Are you sure? I still see the previous code fragment here:

http://test1.virecodesign.ro/templates/ ... style1.css

Look again please!
I've put the code back, i've deleted the previous time because nothing chamged

Please always refresh your browser cache after the CSS changes - for me the top line dissapeared. The only part of line is over the logo and it can be removed by removing in style1.css (around line 31.) the border-top property for the following selector:

Code: Select all

h1#gkLogo, h1.gkLogo.text

I want to keep the line from above (stripes.png).

Please revert the change with div.bg and remove the border from logo as I've mentioned in the previous post. Then please add to the #gkPageTop selector the following code:

Code: Select all

margin-top: 5px!important;


still my background is on top of the line (stripes.png)

Because you have added margin-top to wrong container - div.bg instead of the #gkPageTop, BTW please use 8px in the margin (now I see that 5px is not enough).

Almost looks perfect.
Still the banner do not align to right edges of the search and the logo contains in the top some black line. I appreciate your support !
Can you have the patience to assist me to achieve the final result to perfect?

I've described how you can remove the border at the logo top in this post:

Please always refresh your browser cache after the CSS changes - for me the top line dissapeared. The only part of line is over the logo and it can be removed by removing in style1.css (around line 31.) the border-top property for the following selector:

Code: Select all

h1#gkLogo, h1.gkLogo.text

to fix the background: please add in the #gkPageTop the following property:

Code: Select all

background-position: 9px 0;

Thnak you !
It looks amazing!
Great job and great support Gavick!