0

我的网页有问题。问题是内容位于页脚下方。

在这里查看我的问题 http://www.webdevout.net/test?0138

容器是

height:100%

position:relative 虽然页脚是absolute并且bottom:0; 我认为页脚是这样制作的，但我错过了什么？我需要页脚与内容始终保持 50 像素（可能是）距离。

4

4 回答 4

4

在这种情况下，您不需要绝对位置，因为您只想遵循正确的页面流程；绝对位置不考虑其他元素，因此您的页脚悬停在您的内容上是合乎逻辑的。

只需删除绝对位置并添加一些边距。;)

于 2013-11-14T10:29:40.470 回答
0

在检查了 Firebug 后，我发现从 CSS 中的 div.footer 类中删除“position:absolute”可以解决问题。

于 2013-11-14T10:40:36.370 回答
0

如果你从页脚中删除绝对位置就可以了，然后放置 50px 的边距顶部；

div.footer {
  height: 70px;
  width: 100%;
  padding: 10px;
  padding-left: 20px;
  background: #F2F2F2;
  border-top: 1px solid #ccc;
  clear: both;
  margin-top: 50px;
}
于 2013-11-14T10:28:52.590 回答
0

由于 .footer 具有绝对位置，因此它不会将 html 内容“推”得更远。如果添加 padding-bottom: 40px; 到 div.main{

它看起来会没事的。

这使得 .main 更大

div.main {
width:800px;
min-height:400px;
margin-top:40px;
padding-bottom: 40px;
padding-left:20px;
}
于 2013-11-14T10:29:37.677 回答