本文介绍了IE8 - 容器与margin-top:10px没有保证金的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

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

首先,这里是一张图片我在photoshop显示我的问题:

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没有保证金的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-28 13:44