Question

有一些问题，但我没有找到一个好的答案。现在正在寻找几个小时。

这是我的jsfiddle： http://jsfiddle.net/foreyez/Mr2ER/

我有一些简单的标记：

<div class='container'>
    <div class='box1'></div>
    <div class='box2'></div>
    <div class='box3'></div>
</div>

和CSS：

.container {
    white-space:nowrap;
}

.box1 {
    width:200px;
    height:200px;
    background:red;
    float:left;
}

.box2 {
    width:200px;
    height:200px;
    background:green;
    float:left;
}

.box3 {
    width:200px;
    height:200px;
    background:blue;
    float:left;
}

当窗户足够小时，盒子仍然会被包裹。有什么建议？注意：我想保持这个浮点数：左，所以不要使用内联块解决方案。

Answer 1

如果您将width:600px;添加到.container，则会强制他们保持内联。

这是你的updated JSFiddle

Answer 2

给#container一个至少与子divs一样大的宽度：

.container {
    white-space:nowrap;
    width:9999px;
}

<强> jsFiddle example

容器没有包装，浮动div包裹？

2 个答案: