Big Header_bg Won's Show Properly

Hi,

I want to add a Header to my site here http://www.gothshop.marleyman.co.uk/store/index.php
and the header is 420 in height. I am using the 'Darkness' Template and I have been into the css file to change the code to make the banner fit.

It looks like this

/wrappers - page or section containers/
#mainWrapper {
background-color: #383E44;
text-align: left;
width: 750px;
height:420px;
vertical-align: top;
border: 1px solid #9a9a9a;
}

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin: 0em;
padding: 0em;
}

#logoWrapper{
background-image: url(../images/header_bg.jpg);
background-color: #383E44;
height:420px;
}

but if you look at the site the banner is only showing 144 pixels in height.

What should I be doing to get this large header banner to fit in?

Thanks,
Kenny M.

Kennym:

Hi,

I want to add a Header to my site here http://www.gothshop.marleyman.co.uk/store/index.php
and the header is 420 in height. I am using the 'Darkness' Template and I have been into the css file to change the code to make the banner fit.

It looks like this

/wrappers - page or section containers/
#mainWrapper {
background-color: #383E44;
text-align: left;
width: 750px;
height:420px;
vertical-align: top;
border: 1px solid #9a9a9a;
}

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin: 0em;
padding: 0em;
}

#logoWrapper{
background-image: url(../images/header_bg.jpg);
background-color: #383E44;
height:420px;
}

but if you look at the site the banner is only showing 144 pixels in height.

What should I be doing to get this large header banner to fit in?

Thanks,
Kenny M.

Remove the highlighted portion from your #mainwrapper declaration: See if that helps

#mainWrapper {
background-color: #383E44;
text-align: left;
width: 750px;
height:420px;
vertical-align: top;
border: 1px solid #9a9a9a;
}

BTW: your background image is 756px × 425px so change the height declaration

#logoWrapper{
background-image: url(../images/header_bg.jpg);
background-color: #383E44;
height:420px;/* change this to 425px*/
}

sigh.. No, still squished in there

and now it is fixed... No idea why, but it is.

Even after you change stuff on your site, you'll see the old version from your browser cache until you clear the cache and reload a fresh copy from the site itself.

By the way, Don't refer to the root page of your site as "index.php". The root ends with a trailing slash only. The URL with a named index file is Duplicate Content. Don't link to that version of the URL.