Div 100% 高度底部留有小边距

Question

我有一个在 IE8 上难以解决的问题。我需要 100% 的高度 div 但我尝试过的所有方法都没有解决问题。

你可以在这里看到问题：http://gyazo.com/71ffde560df4d3f87c0fb55a92ef8313

问题是页面底部的小白边，这只在ie8上出现（在ie9上没问题）。我能够通过删除文档类型来解决它，但它解决了问题，但破坏了所有应用程序。

CSS:

html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline;
}

html {
    height: 100%;
}

body { 
    height: 100%;
}

div {
    height: 100%;
    min-height: 100%;
    background:#9699FF;
    color:#fff;
}

很抱歉没有添加更多图片/链接，但我对此没有任何声誉。

Answer 1

您分享的截图没有白边。您看到的是一个带有浮雕花纹的 Windows GUI 元素 - IE8s 浏览器的边框 window。

您可以尝试通过向 <html> 标签添加红色背景来验证这一点。

html {
  background: red;
}

如果您的 div 上有任何类似边距的效果，您应该会看到红色背景。

我在我的 IE8/WinXP 虚拟机上测试了您的 link，没有额外的保证金。（参见：Screenshot）

我放大了屏幕截图的左下角 (click here)，因此可以更清楚地看到内部 window 边框。

Div 100% 高度底部留有小边距

Div with 100% height has an small margin on bottom

html

css

internet-explorer-8