1

我不知道为什么这里的内容和页脚之间有一个安静的大空间：jsFiddle

我已经设置margin-bottom, padding-bottomof content 和margin-topand padding-topof footer 为零。但为什么它还有空间？

4

3 回答 3

3

p您会看到在内容和页脚中的标签之间折叠边距的经典行为。

您可以通过多种方式解决此问题，例如：

body #container #wrapper {
    margin: 0px 15px 0px 15px;
    padding: 67px 0px 0px 0px;
    background-color: white;
    box-shadow: 0px 0px 10px 5px #969696;
    overflow: auto;
}
body #container footer {
    margin: 0px 15px 0px 15px;
    padding: 0px;
    background-color: greenyellow;
    height: auto;
    overflow: auto;
}

设置overflow: auto在您的footer和#wrapper元素上。

此外，将页脚的高度设置为自动，以便为文本留出足够的空间。

演示在http://jsfiddle.net/audetwebdesign/9jMrR/

但是，您的包装器底部有一个盒子阴影，您需要决定您希望它如何工作。如果您希望它可见，则需要在页脚中添加上边距。

于 2013-09-12T01:26:53.873 回答
0

这是一种不好的方法，但您可以应用 css 规则 margin-top:-10px 来减少内容和页脚标签之间的空间。

footer{
margin-top:-10px
}
于 2013-09-12T01:30:12.153 回答
0

您可以添加负边距：

footer { 
    margin-top:-20px;
}
于 2013-09-12T01:40:12.637 回答