Div's and 100% Height

[adamspt2]

I think my request is something like [webmasterworld.com...] but I'm guessing I wasn't doing something quite right. The page I'm working on currently has several divs. I would like to have the image in the right vertical banner to extend the full height of the page which changes due to the amount of content on the page.

Currently, my divs are set up like:

#logo {position:absolute; width:175px; height:220px; z-index:1; left: 5px; top: 5px;}
#ltmenu {position:absolute; width:175px; height:500px; z-index:1; left: 5px; top: 235px;}
#topcontent {position:absolute; width:800px; height:1500px; z-index:1; left: 185px; top: 10px;}
#rtbanner {position:absolute; width:50px; height: 3000px; z-index:1; left: 1185px; top: 0px; background-image:url(../images/rtbanner.jpg)}
#rtads {position:absolute; width:180px; height:3000px; z-index:1; left: 1000px; top: 0px; }

[coopersita]

If you want divs to work toghether, you shouldn't use position:absolute.

When you use position:abosolute items are taken out of the normal flow of the document, and stop "talking" to each other.

You could place your right banner image on the body, so it will extend the whole page, though:

body { background:url(../images/rtbanner.jpg) top right repeat-y; }