粘性頁腳不放在底部

我只是對頁腳進行了一些快速更改。粘性頁腳不放在底部

頁腳需要粘性，我按照A List Apart方法描述的方法嘗試讓頁腳留在底部，但它似乎只是一點點關閉。

html, body { 
height: 100%; 
} 
#container { 
position: relative; 
min-height: 100%; 
} 

<div id="container"> 
    <div id="content">...</div> 
    <div id="footer">...</div> 
</div>

來源

2013-02-14 rowefx

我總是使用CSSStickyFooter method。

HTML，基本骨架

<div id="wrap"> 

    <div id="main"> 

    </div> 

</div> 

<div id="footer"> 

</div>

CSS，這僅僅是一個片斷

* {margin:0;padding:0;} 

html, body {height: 100%;} 

#wrap {min-height: 100%;} 

#main {overflow:auto; 
    padding-bottom: 180px;} /* must be same height as the footer */ 

#footer {position: relative; 
    margin-top: -180px; /* negative value of footer height */ 
    height: 180px; 
    clear:both;}

來源

2013-02-14 14:54:51

我想你應該添加到#wrapper指定clearfix，增加高度： 100％到#wrapper和#container在這種情況下，你會看到底部應該是。現在您應該將頁腳設置爲負高度，並且它應該可以工作。博我不知道它是否會涵蓋包裝的內容。

來源

2013-02-14 15:39:59 kspacja

我檢查了它。它將涵蓋內容。但有了這個內容，它應該是很好的工作。作爲絕對定位。如果你將有更多的內容只留下頁腳沒有任何定位。 – kspacja 2013-02-14 16:11:16

如果我不添加任何定位，它將不會在主頁底部。 Urgh！正如你所說，我已經添加了clearfix來包裝。 – rowefx 2013-02-14 16:19:36

如果內容大於高度，我將會是。 – kspacja 2013-02-15 10:42:40

粘性頁腳不放在底部

回答

相關問題