Question

我有一个横跨页面宽度的页脚。在页脚内有一个基本上充当页脚背景图像，填充页脚/页面的整个宽度。但是，在IE中，页脚下方有一些空白区域，它应该与页面底部齐平。在Firefox，Safari等中看起来很好。这就是我所拥有的，有关于某些事情的建议吗？

<body>
     <div id='container'>
          <div id='content'></div
     </div>

     <div id='footer'></div>
</body>

CSS是：

html {
    font:62.5% 'Helvetica Neue';
    color:#777676;
    margin:0;
    padding:0;
}

body {
    font-size:1.8em; /* 18 px */
    line-height:1.2em;
    margin:0;
    padding:0;
    width:100%;
}

#container {
    width:906px;
    margin:0 auto;
    height:100%;
    position:relative;
    z-index:10;
}

#content {
    padding-top:20px;
}

div#footer {
    position:relative; 
    bottom:0; 
    clear:both;
    width:100%;
    z-index:1;
}

div#footer img {
    width:100%;
    border:0 none;
}

Answer 1

在图片上添加display:block;，应该修复它......

（如果您希望在文字中看到<tags>，请在问题中使用代码突出显示...）

Answer 2

这可能是一个非常复杂的答案。我之前碰到过这个问题，现在我忘记了解决它的方法。首先，我应该问你测试的哪个版本的IE，它可能是旧的。我不认为这在IE 8及以上版本中是一个问题。接下来，是您的DOCTYPE集。然后尝试在页脚上设置高度和/或行高。确保所有兄弟元素和父元素都设置了“位置”，“顶部”和“左侧”。

您是否尝试过将其定位为“绝对”并且如果不起作用则删除正文中的所有其他元素，将它们一次一个地添加回来直到它中断，然后找出您添加的元素有什么问题。

相对定位的页脚 - IE下的空白区域？

2 个答案: