Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

Nested DIVs height: problem

Trying to get child DIV to automatically adjust to parent's height.

8:43 pm on Feb 20, 2006 (gmt 0)

Preferred Member

10+ Year Member

joined:Dec 3, 2004
votes: 0

I am having difficulty trying to get child DIV to automatically adjust to parent's height. Here's my CSS:

#menubar {padding-top: 15px; margin-right: 77px; float: left; width: 163px; height: 100%; border: 0; background-color: #2B04BD;}
#content {float: left; width: 95%; background-color: #ffffff;}

Now my #content DIV is filled with dynamic content, so the height of the div will change day-to day. The code on the page reads simply:

<div id="content">
<!--####### Sidebar-->
<div id="menubar">
Side Menu ---
<!--####### End Sidebar-->

Now since the #menubar DIV has a colored bg, I would like it to continue all the way down to the bottom of the #content DIV. Is setting the height to 100% not enough? I thought this was acceptable, but obviously I am doing something wrong! I have tried searching Google for "Nested DIVs" and other like searches, but have been unsuccessful in finding my problem in particular. Any help on this matter is GREATLY appreciated!


-- Zak

10:09 pm on Feb 20, 2006 (gmt 0)

Preferred Member from US 

10+ Year Member

joined:June 6, 2005
votes: 1

Now, wouldn't that be nice. I think this is a bug, and simply does not work (100% height that is).

Maybe someone knows a trick, because I can use an answer too. :)

4:41 pm on Feb 21, 2006 (gmt 0)

Junior Member

10+ Year Member

joined:June 9, 2005
votes: 0

Why don't you put a background in the parent container that has both the content and sidebar backgrounds in it.

Google for faux columns.


Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members