CSS 对齐到页面底部
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8929781/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Css align to bottom of page
提问by CsharpBeginner
I want my footer to always be on the bottom and move to adjust to the size of the content inside the page. Right now I have dynamic content that covers the footer because it's to much content.
我希望我的页脚始终位于底部并移动以适应页面内内容的大小。现在我有覆盖页脚的动态内容，因为它的内容太多了。
How can I fix my CSS:
如何修复我的 CSS：
div#Footer {
width: 100%;
height: 80px;
padding: 1px;
-moz-border-radius: 35px;
border-radius: 35px;
background-color: Black;
color: #ffffff;
position: fixed;
bottom: 0;
text-align: center;
margin-left: auto;
margin-right: auto;
}采纳答案by Jakub
This has been asked countless times, you are looking for a Sticky Footer.
Simply follow the link there, this is a well known technique and they offer all the source code there.
这已经被问过无数次了，你正在寻找一个粘性页脚。
只需点击那里的链接，这是一种众所周知的技术，他们在那里提供所有源代码。
回答by megaSteve4
Its a little unclear what you want but this code has worked well for me.
它有点不清楚你想要什么，但这段代码对我来说效果很好。
Credit - http://css-tricks.com/snippets/css/fixed-footer/
信用 - http://css-tricks.com/snippets/css/fixed-footer/
#footer {
position:fixed;
left:0px;
bottom:0px;
height:30px;
width:100%;
background:#999;
}
/* IE 6 */
* html #footer {
position:absolute;
top:expression((0-(footer.offsetHeight)+(document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop))+'px');
}
回答by Jacob Gunther
This is a simpler solution.
这是一个更简单的解决方案。
#footer {
bottom: 0%;
position: fixed;
}
回答by mrtsherman
You need to post more html/css to be positive of what is going on here, but it sounds like your footer is being covered by your content page. If this is the case then setting a z-index on the footer will probably sort the issue.
你需要发布更多的 html/css 来肯定这里发生的事情，但听起来你的页脚被你的内容页面覆盖了。如果是这种情况，那么在页脚上设置 z-index 可能会对问题进行排序。
z-index: 1000;
This can also typically be sorted by making sure your footer appears at the end of your html, as elements declared later appear on top of previous ones.
这通常也可以通过确保您的页脚出现在 html 的末尾来排序，因为稍后声明的元素出现在之前的元素之上。
