Full Width Header, 1000px body

[temsamane]

How can i create a full width header in vb5? (body 800 px)


#header .site-logo img {width: auto; max-width:none;}

did not work for me

[Max Taxable]

max-width 100%

[temsamane]

I tried

#header .site-logo img {width: auto; max-width 100%;}

nothing is changed.

[Max Taxable]

I'm a total clueless oaf when it comes to vBulletin version 5. Someone knowledgeable like Lynne will be along, stay patient.

[jessicajonnie]

I'm trying to do this as well. Thanks!

[RichieBoy67]

Did you change this in Stylavars as well?

Also, if you are using width 100% you do not need auto.

[Seven Skins]

You can do something like this but your site will not display nicely on mobile devices.

#header .site-logo {
min-width:800px;
max-width:8000px;
}
#header .site-logo img {
height: 100px;
width:800px;
max-width:800px;
}

[Max Taxable]

You can do something like this but your site will not display nicely on mobile devices.

#header .site-logo {
min-width:800px;
max-width:8000px;
}
#header .site-logo img {
height: 100px;
width:800px;
max-width:800px;
}I think that would work for what the OP appears to be asking. Not sure how vB5 treats mobile browsers - does it have a app or a separate style for those?

[Seven Skins]

Not sure .. I haven't used/played around too much with vb5 yet ... lol

[Max Taxable]

Did you change this in Stylavars as well?

Also, if you are using width 100% you do not need auto.I missed that in his post. Yes this would seem to negate the max-width definition completely.

[Max Taxable]

Here's what I do on this, in vBulletin3.8.x. No reason I know of that it wouldn't also work on versions 4 and 5.

Image code:<a name="top"></a>
<td valign="top" style="padding: 0pt;"><table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<td align="center"><a href="./"><img class="imageObject" alt="Your Forum Name" src="http://yoursite.com/images/misc/yourbannerimage.jpg" width="100%" height="100%" border="0" align="center" /></TD></table>

Then in extra CSS attributes, define the img class for IE compliance: (This is a MUST.)

.imageObject {
max-width: 100%;
}


And that's it.

Live examples:

The Dallas Cowboys Forums - Dallas Cowboys fan forum (http://www.dallascowboysforum.com/?styleid=5)

US Messageboards - Opinion, News and Information (http://usmessageboards.com/index.php?styleid=17)

You can see the header image adjusts to your browser width. As you make it skinny, or wide, it moves like a 3 piece header would. It also scales down to whatever size any mobile browser would be.

BEST RESULTS: Make your banner image large in size, 1920 wide by whatever you want the height to be on fullscreen, 170 is a nice size. This way we are only ever scaling the image DOWN, not up and this really helps the quality for bigger screens.

[Lynne]

Do you mean like here - http://mudslide.vbulletin.net/ ?

Edit the header_background stylevar and under Background Image enter "url(http://url.to/image.png)" and repeat-x (or no repeat if it is the exact width) . I think that should do it.

[Max Taxable]

That's handy for repeating a small image to fill the width.