Question

我对IE 8填充设置有疑问。如果您查看我的网站mywebsite，您会看到中间部分（从菜单栏下方开始）比其他部分宽，并使网站不成比例。这是由于我应用于此div元素的填充设置。您可以在h2元素中看到相同的问题 - 例如“平面共享”：栗色颜色背景扩展到元素区域之外，该区域在右侧白色三角形的边缘处结束。有谁知道如何解决这个问题？它只发生在IE 8中;在IE 7和Firefox中运行良好。这是我的CSS的摘录

#page {
width: 1000px;
margin: 0px auto;
padding: 20px 5px;
background: #FFFFFF;
}

.sidebar li h2 {
height: 40px;
width: 220px;
margin: 0 0 0 0;
padding: 10px 15px 0px 15px;
background: #890208 url('../images/img05.jpg') no-repeat left top;
letter-spacing: -1px;
font-size: 16px;
color: #FFFFFF;
}

更新：我遵循马修的建议并决定不明确定义宽度和高度。瞧，问题解决了。谢谢各位回复。

Answer 1

问题是你在主div上有一个内联样式，它包含1000px的所有内容。其中的每个元素都具有相同的宽度。这在您遇到的所有浏览器中都不起作用。尝试在内部div上使用百分比作为95％（这个数字只是一个猜测...它将取决于你的边距/填充有多大）。

这种情况的原因是所有div和主div都考虑了边距和填充。您试图在具有相同宽度的div内部放置div。这两个div都有默认的边距/填充。此外，您已明确声明了一些具有意外应用行为的填充。

Answer 2

您可能必须使用条件语句来抵消填充问题，而不会影响其他浏览器。这是使用reset.css文件的主要原因，但是在这个阶段的后期实现重置无疑会带来更多的麻烦。

<!--[if IE]>
    link a stylesheet that deals with the offset
<![endif]-->

这是许多可能的解决方案，但它会起作用。

IE 8和填充问题

3 个答案: