0

我已经查看了此处发布的一些问题,但是对于如此简单的任务来说,一切似乎都过于复杂了?我只想要一个无论页面垂直多长时间都固定在屏幕底部的页脚。一切正常,除了我不能让页脚居中,它总是左对齐..?谢谢! 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;
}
4

2 回答 2

3

更新您的 HTML 以包装在包装器 div 中

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

演示

于 2012-11-21T19:34:01.773 回答
1

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

请注意,对于完整的修复,您还应该添加这个(这是一个简单的 IE 修复):

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

当然,#footer 需要有width: 100%;

还有小提琴:http: //jsfiddle.net/n4xxj/3/

于 2012-11-21T19:38:05.030 回答