Making Div Boxes Go to the Bottom of the Page

[J-o-h-n-n-y]

Hi,

I have just started re-designing my site to use CSS rather than tables. Part of my code is this:

div.left { text-position: center; float: left; width: 25%; background-color:
#FF9999; padding: 3px; border-width: 0px; border-bottom-width: 20px;
border-right-width: 20px; border-color: #FF3333; border-style: solid;
rightmargin: 20px; margin-right: 8px; }

However, I want that box to continue all the way to the bottom of my page no matter how much text is in the box or how big the page is. I've tried 'height: 100%;', and several other things.

Is this even possible?

[Sunny G]

I think you should be able to do this:


html, body {
height:100%;
}


That makes both html and body go 100%.

Or you may have to use the faux column technique... I'm still somewhat new to CSS, so I may be wrong. I use the faux column technique here...
http://www.team847.com/new layout/

And you can read about it here:
http://www.alistapart.com/articles/fauxcolumns/

[ray326]

Or you may want to read the Holy Grail article at A List Apart, too.

[J-o-h-n-n-y]

Thanks guys!