獲取頁腳留在頁面底部

Question

可能重複：
CSS to make HTML page footer stay at bottom of the page with a minimum height

（鏈接網站：http://www.eastsidespeedway.weebly.com/）

請使用上面的鏈接，你的瀏覽器開發者工具來查看html/css。

我試圖讓頁面的頁腳停留在頁面的底部。它現在看起來可能已經停止，但這只是因爲它適合頁面。例如，如果你轉到/404.html，你會發現它是一個無標題的頁面，並且頁腳幾乎在頁面的一半處！我使用Weebly添加內容等，但我使用Dreamweaver來構建網站。我在網上嘗試了多種東西，但他們似乎使頁腳高於實際內容，以至看不到它。我需要它低於內容。

網站的佈局是這樣的（例子）：

<div id="container> 
    <div id="navigation"></div> 
    <div id="content"></div> 
</div> 

<div id="footer-container> 
    <div id="footer"></div> 
</div> 

你可以看到，頁腳是在一個單獨的容器中。這是因爲有一個背景圖片需要顯示100％的頁面寬度，而容器的寬度是960px。

我對html/css有點新，所以對不起，如果你不太明白。

再次，如果您需要任何幫助，請使用瀏覽器中的開發人員工具。 ：P

任何意見，建議，答案表示讚賞。

Answer 1

只需添加到#footer-container

position:absolute; 
bottom:0px; 

爲了把footer在頁面的底部。

Answer 2

EDITED

<div id="wrapper"> 
    <header></header> 
    <div id="main"></div> 
    <footer></footer> 
</div> 

body, html, #wrapper { height: 100%; } /* Create space for elements to be 100% */ 
#wrapper { display: table; } /* Create a table-structure */ 
#wrapper > * { display: table-row; } /* All direct children behave as rows */ 
#wrapper > header, 
#wrapper > footer { min-height: 100px; } /* These must be at least 100px */ 
#main { height: 100%; } /* Let the mid section fill up the remaining space */