DIV的高度CSS问题

Question

因此，这里是我的代码：

#logo { 
position:fixed; 
color: white; 
width: 100%; 
padding: 5px; 
left:0px; 
top:0px; 
height:50px; 
width:100%; 
background:#ffffff; 
z-index: 1; 
} 

#page-container { 
margin: auto; 
width: 960px; 
height: 100%!important; 
background: #ffffff; 
border-style: solid; 
border-color: red; 

} 

html, body { 

padding: 0; 
} 

body { 
font-family: Arial, Helvetica, Verdana, Sans-serif; 
font-size: 12px; 
color: #000000; 
background-color: #eef3f7; 
} 

#footer { 
position:fixed!important; 
position:absolute; 
color: white; 
clear: both; 
width: 100%; 
padding: 0; 
left:0px; 
bottom:0px; 
height:30px; 
background:#272695; 
text-align:center; 
} 

我希望能够让页脚了几圈它一路走过来设置页面容器高度。我得到的问题是这样的：

我要的是有我的网页内容规则来覆盖整个顶部和底部没有重叠。我在寻找沿此线的东西：

老实说，我已经试过各种我只是不知道是什么问题。

Answer 1

添加到您的CSS。到它的父和高度默认为auto

body, html { 
    height: 100%; 
} 

的CSS height属性是相对的。所以为了让你的＃页面容器成为100％，你必须设置父高度。