I have a layout with the following structure:
Code:
#page {
background-color:#000000;
width: 780px;
margin: 0px;
padding: 0px;
}
#content {
width: 650px;
height: 500px;
background-color: #FFFFFF;
padding: 0px;
margin: 0px;
float: right;
}
#sidebar {
width: 130px;
height: 450px;
background-color:#666666;
padding: 0px;
margin: 0px;
float: right;
}
Inside the body tags, I placed the following code:
Code:
<div id="page">
<div id="content">/*some content*/</div>
<div id="sidebar">/*navigation*/</div>
</div>
Now I am running in the following troubles. As you can see, the parent layer (page) has a black background, the others are white and grey, respectively. I would like the parent (background) layer to grow with the navigation/content layers, dependent on which layer is higher/taller... get the idea? Thus far, the parent layer "page" does not show at all, neither does its black background.
Any idea how to make it dependable? I've been trying hard to figure it out, can't seem to do it. Perhaps the float attibutes cause it not to have any influence on the parent layer? :chomp:
Thanks guys!