Forum Display Enhancements - Fluid 3 part header

Not a difficult thing to do but I thought I would post it any way as some people seem to having trouble with getting their header image to have an align image right as you can't do it in stylevar.

This is fluid all you need to do is make 3 images, I named mine left, right and background (See attachment), you can be more creative


In your header template find

<div><a name="top" href="{vb:raw vboptions.forumhome}.php{vb:raw session.sessionurl_q}" class="logo-image"><img src="{vb:stylevar titleimage}" alt="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}" /></a></div>

Replace with

<div id="headerFill"><div id="headerL"></div><div id="headerR"></div></div>

Add to vbulletin.css template

#headerFill{
background-image: url(images/headerFill.jpg);
background-repeat: repeat-x;
height: 119px;
width: 100%;
margin-right: auto;
margin-left: auto;
}
#headerL{
background-image: url(images/headerL.jpg);
height: 119px;
background-repeat: no-repeat;
width: 348px;
float: left;

}
#headerR {
background-image: url(images/headerR.jpg);
background-repeat: no-repeat;
height: 119px;
width: 332px;
float: right;

}

Change sizes and paths in red to suit your own

Thanks to hoof for the CSS update.

Mark as installed for support

[Brandon Sheley]

Originally Posted by syrus.xl

Why are you using the Table tag with vBulletin 4.0? This will break strict xHTML compliancy, which is what version 4 is all about.

It should be coded as a div layout, not a table layout.

completely agree :up:

[Magz]

Originally Posted by Beermonster

Are you using VB4?

Sure am, updated test site today to Beta 4

[Beermonster]

Originally Posted by syrus.xl

Why are you using the Table tag with vBulletin 4.0? This will break strict xHTML compliancy, which is what version 4 is all about.

It should be coded as a div layout, not a table layout.

Originally Posted by Loco.M

completely agree :up:

Feel free to re do it this was only meant to be a quick fix for people

[Beermonster]

Originally Posted by Magz

Sure am, updated test site today to Beta 4

Not sure then because I don't have the
Welcome, Magz. You have 0 unread messages; Total 22.
You last visited: Today at 20:11; You Have 4,062 Unread Posts

[Mastergumble]

Originally Posted by syrus.xl

Why are you using the Table tag with vBulletin 4.0? This will break strict xHTML compliancy, which is what version 4 is all about.

It should be coded as a div layout, not a table layout.

So how it would be done ?

[imported_pmay68]

Originally Posted by Mastergumble

So how it would be done ?

Yes, inquiring minds want to know..

[Dr.osamA]

I try to experience

Thank you
________
Gay Arab

[MikesSite]

Looks good

[syrus.xl]

Originally Posted by Mastergumble

So how it would be done ?

There is 5 serious errors in that coding, certain tags not closed, a div tag used within an 'a' tag.

It should be strict xHTML to comply with vBulletin 4.0, otherwise you are just breaking the correct coding. Google would probably penalize you, if that was in every page of your site's header code.

If it was done correctly it would require CSS to be defined and use all div's, not tables. Probably about 4-5 CSS rules is all that it requires, nothing major.

[Beermonster]

Google doesn't penalise tables or reward tableless.

Google rewards content