Question

My page here在页脚的末尾有一个白色的间隙，但在尝试了一切之后我觉得我仍然不知所措。

由于固定的右导航和流体中间容器，我们使用'推'类和负边距来实现可能影响它的相等列。

这是CSS：

#main-content {
margin: 0 5% -100px;
min-width: 960px;
max-width: 1137px;
overflow: hidden;
min-height: 100%;
}

.right-nav {
float: right;
width: 31.5%;
border-left: 1px solid #DDD;
padding-top: 1.5em;
padding-bottom: 10040px;
margin-bottom: -10040px;
width: 358px;
}

#middle {
width: 67.2%;
height: 100%;
padding: 1.5em 1.2% 15px 0;
margin-bottom: 3em;
width: auto;
margin-right: 358px;
}

#footer-wrapper, #push {
height: 100px;
overflow: hidden;
}

#footer-wrapper {
clear: both;
width: 100%;
border-top: 1px solid #323232;
padding: 20px 0 0;
background: #33383C;
background: #3F4952 url("/images/bg.jpg") repeat;
}

Answer 1

由于某种原因，#_atssh（id为“_atssh”的div）是罪魁祸首，即使其位置设置为绝对，隐藏可见性。而是添加样式display: none。

这当然很有趣，我会继续调查。

Answer 2

由于一些奇怪的原因导致#_atssh div导致这种情况，两个解决方案......

首先是#_atssh{display:none;}

其次，您可以将其向上移动几个像素#_atssh{bottom:10px;}

Answer 3

以下是删除页面底部额外像素的快捷方法：

#footer-wrapper {
  margin-bottom:-1px;
}

Answer 4

NetworkNerds解决方案可行，但我不喜欢使用负值进行定位。我建议改为：

#footer-wrapper {
    clear: both;
    width: 100%;
    border-top: 1px solid #323232;
    padding: 20px 0 0;
    background: #33383C;
    background: #3F4952 url("/images/bg.jpg") repeat;
    position: absolute; /*This will set the position*/
}

页脚下方神秘的白色间隙

4 个答案: