header background

[afterburn25]

I had a problem with my template. the header was only 62px from top to bottom the logo did not automatically increase header size it basically but the header under the nav bar.
I adjusted the header size to fit the logo. however not it didn't increase it with the backgtound image so now has a white space in between

here is page http://www.spicypantry.com how do i fix it so the bg image fills the entire header

[nerbert]

I got it looking pretty good by using inline styles;

Find <div id="header"


<div id="header" class="floatcontainer doc_header" style="height: 230px;">
<a name="top" href="forum.php?" id="logo" style="top: 70px;">

[afterburn25]

yes that changes the height but it doesn't add the upper background image to the whole header all i have is white space

[nerbert]

I don'tknow what you mean by upper background image, The black bar with login links?

Looks like you changed floatcontainer class to "display:block". That messes up your navbar links and scrunches them all up. Try setting div id="header to "width:100%" instead.

I dunno why vB makes logo placement so tedious! I've helped some other people with this stuff and had a bad time with it on my own forum

EDIT : You have a top value of 20 px for #toplinks in additional css that you probably don't want

[afterburn25]

no that doesnt work all i need to do is have the background image show up over the whole header there is a white space inbetween the nave bar and the top login panel

--------------- Added 1421307001 at 1421307001 ---------------

also need to float the nave bar links to the left instead of center

--------------- Added 1421307089 at 1421307089 ---------------

I didnt change it its this stupid template i dont know why they designed it this way

[nerbert]

I figured some of this out. Restore your template back to original and restore your style settings.

Now use inline style to give the header div "overflow-y:hidden;" Now it will expand vertically for any image. As for having the black extend all the way down to the navbar I don't think you can do that because it's an image in class doc_header. I would just get rid of the image and set header background color to whatever you want.

[afterburn25]

im not very good with styles and have no idea about how to use inline style i cant find it

[nerbert]

<div id="header" class="floatcontainer" style="overflow-y:hidden; background-color:#404040;">


I removed class doc_header to get rid of the black top. I don't know what background-color you want. See http://www.w3schools.com/html/html_colors.asp

Anywway I'm off to bed. Will check tomorrow

[afterburn25]

i tried it without doc header but wouldn't work just screwed everything up and put nav bar at top of page I tweaked it a bit and found this worked

<div id="header" class="floatcontainer doc_header" style="height: 160px; background-color:#00364A;">

how does it look http://www.spicypantry.com

--------------- Added 1421342965 at 1421342965 ---------------

honestly kinda thinking maybe a background image would look nicer there anyway i can use an image instead of color

[nerbert]

If you're going to keep doc_header in there, either get rid of the image part of it or get a nice image 160 px tall.

If you need a gradient image I can make one.

[afterburn25]

what image part of it do i have to get rid of?

[Seven Skins]

add this to the last line of additional.css template

.doc_header {background-color: #00364a !important;}

[nerbert]

what image part of it do i have to get rid of?

I'm seeing multiple versions of doc_header in my dev tool. You only need one version.

To comment out the image part:

/*background: url(images/styles/CinemaIce/style/headerBG.gif) repeat-x top left;*/