Question

在缩放窗口后，是否有css规则使父<div>保持其大小（取决于元素）？为了更清楚，这是一个例子：

<div style="width: 100%; height: 100%;">
    <div style="width: 30px; height: 30px;">
        text1
    </div>
    <div style="width: 60px; height: 30px;">
        text2
    </div>
    <div style="width: 30px; height: 30px;">
        text3
    </div>
</div>

此代码应该显示一个内部有3个较小div的div。现在，当您调整窗口大小时，各个孩子将被“打破”成新行。

我该如何防止这种行为？使用min-width将不起作用，因为我希望宽度动态，添加和删除子项应该是可能的。我想到的唯一选择是通过javascript对孩子进行计数，然后通过javascript设置min-width属性。但我认为这应该可以用css来处理。

Answer 1

添加：

white-space: nowrap;

到父div。我认为这将使他们保持一致。在您提供的示例中，您还需要：

display: inline;

关于儿童div。

http://jsfiddle.net/9dzBy/

CSS - 保持元素的宽度

1 个答案: