流過粘腳的內容

我有一個用於我的網站的包裝器，目前我正在爲HTML5首次編寫一個功能齊全的網站，並且遇到問題讓我的頁腳「粘」到包裝器的底部。流過粘腳的內容

當我擺弄CSS時，我有時會成功地將頁腳粘貼到包裝的底部，但是如果包裝（文章/部分）的內容超過了瀏覽器的範圍，那麼包裝器打破了包裝邊緣，因爲包裝的高度只是屏幕分辨率的高度（在這種情況下是768）。所以內容最終會在頁腳後面展現出來。

反正代碼：

 <footer> 

    <p><small>&copy; Copyright blahdeblah 2013. All Rights Reserved.</small></p> 

    </footer>

CSS：

html,body{ 
height:100%; 
} 

    #wrapper { 
height:100%; 
margin:0px auto; 
position:relative; 
width:900px; 
} 

footer{ 
background:#B4B4B4; 
border:5px solid #FFFFFF; 
height:50px; 
line-height:45px; 
position:absolute; 
bottom:0px; 
text-align:center; 
width:100%; 
}

所以基本上我的包裝不與內容:(擴大

來源

2013-09-25 BITmixit

可以請你在Jsfiddle中展示這個問題嗎？ –

看看[這個問題+答案]（http://stackoverflow.com/questions/13881548/sticky-footer-hiding-content?rq=1）。應該解決你的問題。順便說一句：網絡上充滿了關於「粘滯頁腳」的教程 - 你做錯了。 – Netsurfer

正如你所看到的，您的包裝的高度設置到100％，這意味着包裝的高度不會超過用戶屏幕的高度，即使其中的內容可能會消除「高度：100％」部分應該可以解決您的問題。呃屏幕會短於包裝內容，會出現滾動條。

來源

2013-09-25 09:16:39 OriShuss

不刪除，但更改爲'最小高度：100％'是正確的方法...！需要一個等於頁腳高度（這裏是50px）的填充底部。 – Netsurfer

高度不能低於100％？ – OriShuss

哦nvm我知道了 – OriShuss

流過粘腳的內容

回答

相關問題