页面底部的空白区域

Vis*_*ani 3 html css

请访问该网站.

底部有一个空白区域.我查了一下,我的css中没有提到最低高度.

我怀疑它的身体css细节如下;

body {
    line-height: 1.5;
    font-size: 87.5%;
    word-wrap: break-word;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    padding: 0;
    border: 0;
    outline: 0;
    background: none repeat scroll 0 0 #EFEFEF;
}


html, body, #page {
    height: 100%;
}
Run Code Online (Sandbox Code Playgroud)

小智 11

这在Safari中删除了我的流血6.0.3;

#footer-wrapper {
    margin-top: 40px;
    background: url("../images/footer.png") repeat-x scroll 0 0;
    overflow: hidden;
}
Run Code Online (Sandbox Code Playgroud)

您可能希望根据其中的内容以不同的方式处理该溢出.但这应该可以解决空白问题.

我通过从DOM自底向上删除节点来解决这个问题.它必须在#footer-wrapper.由于边缘底部不起作用并且你使用相对定位,我认为这是一些阴影造型流出的元素.

更新(更好的修复)

刚刚找到问题的真正问题;

.clearfix::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
Run Code Online (Sandbox Code Playgroud)

更改content: ".";content: "";和它的固定.或者只是删除该样式,因为在这种情况下它似乎没有用.

  • 我有一个与上面类似的问题,但只是添加了 `overflow: hidden;` 为我修复了它,谢谢 (2认同)