AgentPress 2.0: How to stretch header & footer to the full width of the screen?

[updatealan]

How do I make my AgentPress 2.0 header and footer stretch to the full width of the screen?

[FireSamurai]

UpdateAlan,

You'll want to remove the width property from both #header and #footer in style.css. However, this will make them so the content bumps right up against the left and right edges of the monitor, so I would recommend adding in some padding:

#header {
    color: #fff;
    margin: 0 auto;
    min-height: 125px;
    padding: 0 20px;
    text-shadow: 1px 1px #000000;
}

#footer {
    color: #ccc;
    font-size: 12px;
    margin: 0 auto;
    overflow: hidden;
    padding: 20px;
    text-transform: uppercase;
}

Hope that helps.

[updatealan]

Very helpful, thanks!

[updatealan]

http://www.dtconfidential.com/contact

Hey again,

I'm having trouble changing the color of the footer.  I've tried everything I can think of, and I'm having no luck. Can you help?

Thank you!

[updatealan]

I figured it out.  Needed to add "background-" before "color."  It, now, reads like this:

#footer {
background-color: #333;
font-family: 'Droid Serif', arial, serif;
margin: 0 auto;
overflow: hidden;
padding: 0 20px;
height: 200px;
text-transform: uppercase;
}

Thanks, and sorry about the multiple posts on my other topic.  I appreciate your patience as I find my footing with WordPress.

Best,
Alan

[FireSamurai]

Alan,

Instead of changing color to background-color you should just add background-color as a new property. Color is the color of the text while background-color is, well... the background color. By changing color to background-color you're removing the text color property for the footer id selector.

[Author]

Posts