PDA

View Full Version : Resolved Having background trouble



kyllle
Mar 26th, 2009, 10:27 PM
Hi all,

Basically Iv tried to extend the background color of my wrapper by adding height: 100% and also playing about with other settings but nothing seems to be helping, could anyone please advise me on how to resolve this problem?

Link to page (http://www.glen-lodge.co.uk/testing/quilly/index.html)

Many thanks in advance

Kyle

kyllle
Mar 26th, 2009, 10:32 PM
Sorry Iv managed to resolve this problem but now the bottom footer image seems to be repeating?

Kyle

BoldUlysses
Mar 26th, 2009, 10:41 PM
Kyle,

You need to clear your floats (http://www.quirksmode.org/css/clearing.html). Try this:


#wrapper{
width:800px;
min-height:100%;
height:auto !important;
margin:0 auto;
background:#002d47;
color:#fff;
text-align: left;
position: relative;
overflow:auto;
}

And zero out the right margin on your nav div:


#nav ul {
float: right;
margin: 0 0 0 0;
padding: 10px 10px 0;
list-style:none;
}

kyllle
Mar 26th, 2009, 10:45 PM
Thanks msuffern but im afraid that doesnt work, adds a horizontal scrollbar to just above the footer?

Excavator
Mar 27th, 2009, 12:29 AM
I'm not seeing the footer image repeating. Maybe you've fixed that already?

If you'd give #footer and #push a height they will work as intended. The #push should be the same height as #footer and then a negative bottom margin added to #wrapper would pull the footer back up onto the screen.

You will also need to close #container when your left and right columns are finished. That way #push isn't in container, it's in #wrapper where it belongs.

Look at the CSS for #push, #footer and #wrap in my demo - http://nopeople.com/CSS/full-height-layout/index.html Pay attention to where #push is.