html - 我怎样才能获得上下40px的粘性页脚

我正在尝试使页脚停留在页面底部。我希望它上下有40px的边距，但无法正常工作，并会不断浏览网站中的内容。有人可以帮我吗？

<div id="footer">
  <div id="footer-line"> </div>
  <div id="footer-nav"> <a href="index.html">Home</a> | <a href="expertise.html">Expertise</a> | <a href="doctors.html">Doctors</a> | <a href="facility.html">Facility</a> | <a href="contacts.html">Contacts</a></div>
  <div id="footer-copyright">© 2013 Website, Inc. All Rights Reserved.</div>
</div>

#footer {
    margin: auto;
    width: 900px;
    height: 50px;
    margin-bottom: 40px;
    position: fixed;
    bottom: 0;

}
#footer-line {
    margin: auto;
    width: 900px;
    height: 2px;
    background-color: #C9DA2A;
    margin-top: 35px;
}
#footer-nav {
    margin: auto;
    float: left;
    width: auto;
    height: 30px;
    color: #666666;
    font-size: 16px;
    font-family: "Times New Roman", Times, serif;
    margin-top: 15px;
    text-decoration: none;
}
#footer-nav a {
    color: #666666;
    font-size: 16px;
    font-family: "Times New Roman", Times, serif;
    text-decoration: none;
}
#footer-copyright {
    margin: auto;
    float: right;
    width: auto;
    height: 33px;
    color: #666666;
    font-size: 16px;
    font-family: "Times New Roman", Times, serif;
    margin-top: 17px;
    text-decoration: none;
}

最佳答案

您在#footer中定义了2个边距：

#footer {
margin: auto; <----
width: 900px;
height: 50px;
margin-bottom: 40px; <----
position: fixed;
bottom: 0;

}

它应该是margin: 40px auto;作为固定元素，它将遍历您网站上的内容。您需要通过将内容容器缩小到固定栏的高度来适应这种情况。

关于html - 我怎样才能获得上下40px的粘性页脚，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17430337/