如何让页脚粘在网页文本的末尾？

Question

我在这个网站上遇到了一个大问题。-> http://www.webbon.ca/demo/dev/home/

问题很简单。我只需要让页脚粘在文本的末尾即可。您可以使用检查元素或萤火虫来告诉我您做了哪些修改才能使其正常工作。

Answer 1

以下是获取粘在页面底部的页脚的简单方法：

CSS：

* {
margin:0;
padding:0;
}
html, body {height: 100%;}
#wrap {min-height: 100%;}
#main {
overflow:auto;
padding-bottom: 150px;
}  
#footer {
position: relative;
margin-top: -150px;
height: 150px;
background-color: #CCCCCC;
clear:both;
}

HTML：

<div id="wrap">

<div id="main">
<h1>Content!</h1>
</div>

</div>

<div id="footer">
<p>I'm the footer.</p>
</div>

您可以在 http://www.cssstickyfooter.com/using-sticky-footer-code.html。