set <div> height according to content outside of tag??

liunx

Guest
I have a left menu setup in CSS & HTML using the <div> tag. Without using tables, i'd like the left menu to appear vertically as long as the page, no matter how much content on the right side the user needs to scroll through.

Is there a way to have the height of my left menu appear relative to the content outside of the tag?

If I use 100% as height, it naturally assumes I mean the content of the <div> tag.

Here's my CSS:
#left_menu { float: left; position: absolute; background-color: #EEEEEE; margin: 0px; padding-top: 20px; width: 15%; height: 100%; }

any suggestions? help a newbie out?
:confused:What I normally do for mine is use use the body css background property, have a width specified of 150px; create a gif, 150px wide by 1px high in the color I want, and then use

body{
background: url(back.gif) left repeat-y;
}


There's an example on <!-- w --><a class="postlink" href="http://www.tollgatesecurity.co.uk">www.tollgatesecurity.co.uk</a><!-- w --> or <!-- m --><a class="postlink" href="http://www.emdevelopments.co.uk/PPC/PPC7/index.htm">http://www.emdevelopments.co.uk/PPC/PPC7/index.htm</a><!-- m -->

alternatively, you need to specify height:100% for every containing element:

html,body{
height: 100%;
}
#left_menu { float: left; position: absolute; background-color: #EEEEEE; margin: 0px; padding-top: 20px; width: 15%; height: 100%; }

That may also work if you need a % wide menuThat's an EXCELLENT idea for the gif background!

I'll give it a try. Thanks!

wublub
 
Back
Top