Question

我想要很多小的div-s彼此相邻，没有换行符：

<div style="overflow: scroll;">

<div style="float: left; width: 40px;"></div>
<div style="float: left; width: 40px;"></div>
<div style="float: left; width: 40px;"></div>

</div>

问题是，宽度有效，但如果溢出则会转到新行，因此不会水平滚动。

Answer 1

您可以使用white-space＆amp; display:inline-block;。写得像这样：

.parent{
 white-space:nowrap;
overflow:scroll;
}
.parent > div{
 display:inline-block;
 white-space:normal;
}

选中此http://jsfiddle.net/EUtLh/

Answer 2

要放置这些div的常规容器的宽度需要设置为“width：100％”，这样我才能适应不断增长的大小。

Answer 3

以下是适合您的脚本。

不确定这是不是你想要的。

http://jsbin.com/anoran/edit#javascript,html

更新：

http://jsbin.com/anoran/2/edit

Answer 4

<div style="overflow-x: scroll; width:100%|400px">
    <div style="width:10000px">


<div style="float: left; width: 40px;"></div>
<div style="float: left; width: 40px;"></div>
<div style="float: left; width: 40px;"></div>


    </div>
</div>

在chrome工作！

彼此相邻，大小，没有换行符

4 个答案: