Question

我已经看过这里发布的一些问题，但是对于应该如此简单的任务来说，一切似乎都过于复杂了？我只想要一个固定在屏幕底部的页脚，无论页面垂直多长。一切正常，除了我不能让页脚居中，它总是左对齐..？谢谢！ http://jsfiddle.net/n4xxj/

<body>
     <div id="content"></div>
     <div id="footer"></div>
</body>




div {
width: 960px;
margin: auto;
}

#content {
background-color: beige;
border: 1px solid;
height: 1200px;
margin-top: 100px;
margin-bottom: 150px;
}

#footer {
background-color: lightgray;
border: solid 1px;
height: 100px;
position: fixed;
bottom: 0px;
}

Answer 1

更新HTML以包装在包装器div

中

<div>   
  <div id="content"></div>
  <div id="footer"></div>
 </div>

DEMO

Answer 2

在这里，您需要将内部div封装到一个大的#container div中并添加到margin: 0 auto;以对齐它。

请注意，要获得完整的修复，您还应添加此项（这是一个简单的IE修复）：

body { text-align: center; }
#container { text-align: left; margin: 0 auto; }

当然#footer需要width: 100%;

也是小提琴： http://jsfiddle.net/n4xxj/3/

中心固定/锚定页脚？

2 个答案: