firefox - Firefox 不会在调整窗口大小时更新浮动相关布局

Question

今天遇到一个奇怪的问题。我一直在使用浮动菜单，该菜单适用于我迄今为止测试过的所有内容（尚未使用旧的 IE 版本......），除了 firefox。页面在首次加载时正确呈现，但如果调整窗口大小，则受浮动元素影响的具有确定性布局的元素（即内联元素、具有溢出：隐藏的 div 等）无法更新。

有人有（最好是免费的）解决方法吗？

HTML：

<div id="leftBar">
    <a>test1</a>
    <a>test2</a>
</div>
<div id="bodyContent">
    <div>
        <div id="contenta">
            Hello world!
        </div>
    </div>
    <div>
        <p>Paragraph test</p>
    </div>
    <div style="clear:both">
        Enclosing div.
    </div>
</div>

CSS：

#leftBar {
    float:left;
    width:50px;
    background:red;
    height:75px;
}

#bodyContent {
    margin:0 auto;
    width:500px;
    background:green;
}

#bodyContent > div {
    overflow: hidden;
}
#contenta {
    width:100%;
    height:50px;
    background:blue;
}

jsfiddle在这里。

Answer 1

我不确定这是否是您想要实现的目标，但我个人会为元素使用容器。

#container {
    width: 550px;
}

#leftBar {
    float:left;
    width:50px;
    background:red;
    height:75px;
}

#bodyContent {
    margin:0 auto;
    width:500px;
    background:green;
    overflow: hidden;
}

#contenta {
    width:100%;
    height:50px;
    background:blue;
}

然后将您的内容包装在容器中。