Question

我有一个左浮动的div，有两排左浮动的子块。每行都用一个简单的清除块清除。

问题是IE6将父块的宽度扩展到可用空间的100％，而在其他浏览器中，父的宽度设置为精确包裹子项。

当浮动所有子块时，IE6中的宽度正确。但是我需要将子块排成行，所以我在每行之后再添加一个清除块。之后父母的宽度扩大到100％。

是否有一种解决方法可以在IE6中拥有正常的父级块宽度？（不欢迎表格）

Have a look at the image illustrating the problem

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
    <style type='text/css'>
        #parent {
            float: left;
            background-color: black;
        }

        .block {
            width: 30px;
            height: 30px;
            background-color: yellow;
            margin: 10px;     
            float: left;
        }

        .clear {
            height: 1px;
            clear: both;
            font-size: 1px;
            line-height: 0px;
        }
    </style>
</head>

<body>
    <div id="parent">
        <div class="block">1</div>
        <div class="block">2</div>
        <div class="block">3</div>
        <div class="block">4</div>

        <div class="clear"></div>

        <div class="block">5</div>
        <div class="block">6</div>
        <div class="block">7</div>
        <div class="block">8</div>

        <div class="clear"></div>
    </div>
</body>

Answer 1

我无法访问IE6，所以我实际上无法检查这一点。但你可以尝试以下方法：

http://jsfiddle.net/YA7CN/

（将块放在一个带有clear的容器中：两者）

正如我所说，它可能会给你同样的问题......但这是一个选择。顺便问一下，您是否正在为使用ie6的特定公众进行设计？如果没有，我不会太担心看起来不同的东西，你会疯狂地将一切都变成一个崩溃的东西的版本！

如何防止浮动的父母浮动的孩子在IE6中扩展到100％的宽度？

1 个答案: