-1

根据这篇文章，我想在我的项目上制作粘性页脚。请看一下这个链接。

我不明白为什么我会得到垂直滚动条，为什么#pagediv 会下降#footer

4

2 回答 2

4

您的页脚顶部有 1px 边框；你的容器有一个 1px 的边框；你的导航有一个margin-top ...所有这些都会影响垂直高度，所以整体高度被推到100％以上=>垂直滚动条。

当您将填充/边距设置为偏移额外像素时，您需要考虑这一点。此外，您还提供了页脚元素填充/边距。您应该做的是使用页脚元素作为包装器，然后在其中创建一个具有适当填充/边距的元素。

以下是如何使它工作...

1 将#nav样式更改为填充：padding: 10px 0 0 0;

2摆脱你的1px边框#container

3 把你的页脚改成这个...

<div id="footer">
  <div id="footer-content">
    © 2012 Code Arts
  </div>
</div>

4将您的页脚CSS更改为：

#footer {
  border-top: 1px solid #C9E0ED;
  height: 53px; /* 20px padding-top + 20px padding-bottom + 13px line-height */
  margin-top: -54px; /* height + 1px border-top */
  position: relative;
  clear: both;
}
#footer-content {
  font-size: 13px;
  line-height: 13px;
  text-align: center;
}
于 2012-11-14T20:32:54.407 回答
0

尝试这个：

z-index: 2;

...在#footer 上。

另外，margin-top:-32767px 到底是什么？应该做的！？

于 2012-11-14T20:30:43.740 回答