頁腳底部停留在頁面底部的問題

我不知道它的問題，反而使頁腳拉伸所有的出路頁（100％）的，我把它包裝DIV之外，所以不是：

<wrapper> 
    <main> 
    </main> 
    <footer> 
    </footer> 
</wrapper>

我這樣說：

<wrapper> 
    <main> 
    </main> 
</wrapper> 
    <footer> 
    </footer>

頁腳的CSS是這樣的：

#footer { 
    height: 100px; 
    background:#393939; 
    font-size:12px; 
    color:#777; 
    margin:0; 
    padding:20px; 
    z-index:999; 
    bottom:0; 
    clear:both; 
}

頁腳現在直接規定所有的內容，所以如果一頁的內容太短，頁腳不在頁面的底部，就像本頁： http://skiss.nu/hff/?page_id=10

如果我添加「位置：絕對;」頁腳停留在此頁面的底部，但它覆蓋了內容更多的內容。

來源

2013-05-14 FridaSofia

您需要將自己的職位設置爲「固定」。

#footer { 
height: 100px; 
background:#393939; 
font-size:12px; 
color:#777; 
margin:0; 
padding:20px; 
z-index:999; 
bottom:0; 
clear:both; 
position:fixed; 
}

來源

2013-05-14 12:43:49 cutoverRooster

工作這麼好，但如果我使用「的位置是：固定」頁腳停留在屏幕的底部，內容在頁腳後面滾動。我希望它在頁面的底部像這個網站上：http://fridasofia.se/ – FridaSofia 2013-05-14 14:15:21

確定只是重新讀你的問題。你需要編寫一個jQuery來檢測包裝器的高度，如果它溢出瀏覽器的高度，在腳註中應用''position：fixed''，否則''position：static;' – cutoverRooster 2013-05-14 14:20:58

好的，我會嘗試那個，謝謝 – FridaSofia 2013-05-16 05:44:38

你可以一個最小高度添加到您的包裝DIV像這樣：

wrapper { 
    min-height: 600px; 
}

這不會看在所有屏幕尺寸真棒，但把工作完成了它的快捷方式。

來源

2013-05-14 12:32:25 Burgon

好了，這樣的作品，但像你說的，它並不適用於不同的屏幕分辨率... – FridaSofia 2013-05-14 14:21:08

頁腳底部停留在頁面底部的問題

回答

相關問題