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％，你必須設置父高度。