IE8 - 容器与margin-top：10px没有保证金 [英] IE8 - Container with margin-top: 10px has no margin

问题描述

编辑：这只发生在IE8，它在IE7，Firefox，Opera等工作正常

This happens only in IE8, it works fine in IE7, Firefox, Opera etc

首先，这里是一张图片我在photoshop显示我的问题： http://richardknop.com/pict.jpg

First of all, here is a picture I have made in photoshop to demonstrate my problem: http://richardknop.com/pict.jpg

现在你应该知道我的问题。这是我使用的标记的简化版本（我省略了最不相关的内容）：

Now you should have idea about my issue. Here is a simplified version of markup I'm using (I left out most irrelevant content):

<div class="left">
    <div class="box">
        // box content
    </div>
    <div class="box">
        // box content
    </div>
    <div class="box">
        // box content
    </div>
</div>
<div class="right">
    <div class="box">
        // box content
    </div>
    <div class="box">
        // box content
    </div>
    <div class="box">
        // box content
    </div>
</div>
<div class="clear"></div>
<div class="box">
    //
    // NOW THIS BOX HAS NO TOP MARGIN
    //
</div>
<div class="box">
    // box content
</div>

CSS风格如下：

.clear {
    clear: both;
}
.left {
    float: left;
}
.right {
    float: right;
}
.box {
    overflow: auto;
    margin-top: 10px;
}

显然我已经省略了所有不相干的风格，如边框，背景颜色和图像，

Obviously I have left out all irreevant styles like borders, background colors and images, font sizes etc. I have kept only important stuff.

任何想法在哪里可能是问题？

Any idea where could be the problem?

推荐答案

查看 padding-top：10px 是否有效。可能是，页边距尝试从页面顶部开始。

See if padding-top: 10px works. It might be that the margin is trying to go from the top of the page.

这篇关于IE8 - 容器与margin-top：10px没有保证金的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！