100％容器高度与页脚

Question

我的网页存在问题。

代码片段：

<div id="header"> // header..
</div>
<div id="content">  // content where ajax is loaded (should be atleast 100% of the site height)
    <!-- ajax -->
</div>
<div id="footer"> //empty atm.

</div>

现在为css：

#content{
    margin-left:auto;
    margin-right:auto;
    background-color:#767670;
    width:800px;
    border-left:1px solid #9F9793;
    border-right:1px solid #9F9793;
    position:relative;
    height:auto !important; /* real browsers */
    height:100%; /* IE6: treaded as min-height*/
    min-height:100%; /* real browsers */

}
#footer{
    width:100%;
    height:40px;
    border-top:1px solid #9F9793;
    border-bottom:1px solid #9F9793;
    background-color:#767670;
}

我希望容器从页眉到页脚，我尝试应用我找到的代码和提示，但没有成功。感谢任何答案！

Answer 1

#content{
height:100%;
}

这意味着内容div占用父容器的100％，在这种情况下是html。

所以写

html{
height:100%;
}