Jump to content
Sign in to follow this  
antics

Changing the Header Background Colour

Recommended Posts

antics

Totally new at this but bear with me. I am building a website for myself and most of the features and looks straight 'out of the box' will suffice. Not planning on editing it up too much. What i would like to do is basically use the default base theme, except have a solid black header that ran the entire width of the page. I imagine this header reaches from the very top of the page to the bottom of the navigation. I've tried to use firebug, or an equivalent, i've tried changing all the 'fixed width' settings, but i'm unable to work it out. One idea i had was to use a page background image with the black set to wrap horizontally, and just trial and error it until i had it line up correctly. But i was hoping for a more elegant solution. thanks in advance.

Share this post


Link to post
Share on other sites
studio8c

Anthony, Whats your site url so we can look with you.

Share this post


Link to post
Share on other sites
catrina

What you're trying to do sounds pretty straightforward. A link would help :)


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
antics
www.renovatedsounds.com Hey, Thanks guys, i had it on maintenance mode because i wasn't ready to launch it yet but i'll switch if off so you guys can help me out. At the moment i've been playing around with the page in black, but id really like the top banner and branding, including the navigation to be black, and to stretch across the entire width of the page and the rest of the site to be white. (i personally find white text on black difficult to read). I don't want the logo and nav to stretch the entire length, just the black, Thanks in advance. and i hope this is making sense!

Share this post


Link to post
Share on other sites
catrina

You'll have to change your site body background to white in the Design Control settings and then make the header full-width by adding this code to the custom code area or your base.css file in the child theme:

#header {background-color: #000;}


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
cshoffmann

In my experience, the code may need to be written: #header {background: #000;} For some reason background-color doesn't always work for me.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×