Question

我感到非常沮丧。我已经研究了几个小时的答案而无济于事。是的，我知道这里已经讨论了这个问题：IE7 float right causes parent element to take up full width

但它似乎没有解决我的问题。：（

我在右浮动元素中有2个浮点数（左和右）。当然在每个浏览器中它都可以工作，除了IE7。父右浮动元素伸展到全宽，而不是环绕在内的2个浮点数。

我在父元素上尝试过zoom：1。我试过在父元素上显示：inline-block。我在父元素上尝试了min-width：1px。

没有哪个工作！我已经完全尝试了它们以及单独的IE7仍然没有变化。我做错了什么???

<div class="parentfloat">
    <div class="leftblock">
        LEFT FLOAT 
    </div>
    <div class="rightblock">
        RIGHT FLOAT            
    </div>
</div>

.parentfloat {
    float: right;
    display: inline-block;
    zoom: 1;
    min-width: 1px;}

.leftblock {
    float: left; 
    text-align: left; 
    margin-right: 60px;
    padding: 0;}

.rightblock {
    float: right; 
    text-align: right; 
    padding: 0;}

Answer 1

通过不为包含.parentfloat的元素设置显式宽度，默认情况下（在IE7中）扩展占据宽度的100％。对此的修复是为.parentfloat类定义显式宽度。

有关示例，请参阅此jsfiddle（为清晰起见，我添加了背景色）。

编辑：考虑到这是一个IE7特定的bug，我建议只通过使用条件样式表，css hack或conditional class将固定宽度应用于IE7。

IE7漂浮正确的bug - 没有通常的解决方案工作

1 个答案: