IE8 - 带有 margin-top 的容器：10px 没有边距

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

首先，这是我在 Photoshop 中制作的一张图片来演示我的问题：http://richardknop.com/pict.jpg http://richardknop.com/pict.jpg

现在你应该对我的问题有所了解了。这是我正在使用的标记的简化版本（我省略了大多数不相关的内容）：

<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;
}

显然，我省略了所有不相关的样式，例如边框、背景颜色和图像、字体大小等。我只保留了重要的内容。

知道问题出在哪里吗？

See if padding-top: 10px作品。可能是边距试图从页面顶部移开。