How to increase header height (how to tutorial)

[travis hill]

I'm not sure if this will work for everyone, but it worked for me. After searching for a few hours I couldn't find anything on how to increase the height of the header on vBulletin 4.2. Just a bunch of people asking how to do it...

So this is what I have came up with. It seems that the header size directly correlates with the size of your logo. "vbulletin4_logo.png" Since I am using a header alone and not a logo this is what I did.

I created a transparent image in photoshop that was 1 pixel wide, and the height, in my case 250px high. I saved the image as a transparent .png named "vbulletin4_logo.png" and uploaded it to my images/misc folder in the vbulletin folder in my ftp. And boom after many hours it finally worked.

http://www.theperfectpose.com/forum


Hopes this helps.

[kNeo]

For future reference you can modify the height of the header by adding the following to additional.css:


#header {
height: 250px;
}

Change 250px to whatever number you want.

I think the vB team's goal here was to make it so the header automatically changed according to the size of the logo you used.

ps: you can add the code above to your own additional.css and then change your logo to be wider so people can click it to go back "home".

EDIT: full code to adjust height of header and make your clickable area wider:

#header {height:300px;}
.logo-image {width:450px;}