Can someone help me troubleshoot my HTML code?
<div id="container">
<div id="left-container">
</div>
<div id="right-container">
</div>
</div>
Although the container is set to 100% height, the #left_container
does not seem to be following suit.
Attached below is my CSS code and a screenshot. The yellow section should also be filling up the entire height. (Yellow represents the background color of the #left-container
)
html, body {
height: 100%;
}
#container {
position:relative;
margin: 0 auto;
width: 100%;
height:100%;
height: auto !important;
min-height:100%;
background: #fff;
}
#left-container {
width: 300px;
background: #ff0;
height:100%;
height: auto !important;
min-height:100%;
}