css - IE7中奇怪的浮动错误

Question

在我在这里工作的网页上，我有一个主 div，在主 div 和图像 div 内。粗略地说，重要的 HTML 是：

<div id="wrapper">
    <div id="main">
        <div class="images">
            <p>Content</p>
            <div class="clear"></div>
        </div>
        <p>Text...</p>
    <div class="clear"></div>
    </div>
</div>

和CSS：

div#wrapper
{
    padding: 10px;
    width: 90%;
}

div#main
{
    padding: 5px;
}

div.images
{
    float: right;
    width: 320px;
    margin-left: 5px;
}

div.clear
{
    height: 0;
    clear: both;
}

如果问题的原因不在此处的代码中，我深表歉意，但我认为是。

问题是，当imagesdiv 变得大于 div 的内容时main，wrapperdiv 失去了它的左填充；并且底部填充main增加。该问题似乎只出现在 IE7 中。

Answer 1

事实证明，给予#main hasLayout是有效的。

div#main
{
    zoom: 1;
}

把它放在 IE7 样式表中，它几乎是固定的。底部的边框仍然很大，但不是太重要。