FF和IE中粘滞页脚下方的空白部分

由于某些原因，我在Firefox和Internet Explorer的粘滞页脚下获得了一些额外的空白（大约1px）。尽管在Chrome中看起来很好。FF和IE中粘滞页脚下方的空白部分

我使用以下HTML结构：

<div id="wrap"> 

    <header><p>Header</p></header> 

    <div id="main"> 
     <p>Content here...</p> 
    </div> 

    <footer><p>Footer</p></footer> 

</div>

CSS：

html, body { 
    height: 100%; 
} 

#wrap { 
    min-height: 100%; 
    position: relative; 
} 

#main { 
    padding: 20px 0 120px 0; /* padding-bottom must be same height as the footer */ 
    position: relative; 
} 

footer { 
    position: absolute; 
    bottom: 0px; 
    height: 100px; 
}

JSFiddle demo（尝试调整窗口的大小，如果这个问题不可见马上）

我只是无法弄清楚是什么原因造成的。 Firebug不会在该空白处显示任何元素。

来源

2013-08-01 Praxis Ashelin

添加overflow:hidden到容器

也

bottom:0px有时被解释为底：1px的四舍五入原因（小区/楼）的问题

不会在任何浏览器中发生，但显然发生在msie上

来源

2013-08-05 09:06:19

FF和IE中粘滞页脚下方的空白部分

回答

相关问题