一个CSS的问题，如何让容器内元素纵向浮动排列？

This topic created in 4921 days ago, the information mentioned may be changed or developed.

有一个高宽固定的容器，比如宽x高=800x200；
有数个高宽固定的元素，比如每一个的宽x高=100x40，个数不定，尺寸一致；
怎么让所有的元素在容器内“纵向优先”填充？也就是说先竖着排，5个就排到了容器底部，于是第6个回到了容器顶部，出现在在(100,0)的地方

容器

高宽

元素

4 replies • 1970-01-01 08:00:00 +08:00

NemoAlex

Dec 14, 2012

无解
绝对定位用 Javascript 来排省事一点

catfan

Dec 14, 2012

每5个元素用一个div包含，然后div向左浮动。

wrap自行清除浮动吧

.column {
float: left;
}

<div class="wrap clearfix">
<div class="column">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
<div class="column">
<div class="item"></div>
<div class="item"></div>
.....
</div>
</div>

loading

Dec 14, 2012

先横着排，然后，转

gucheen

Dec 14, 2012

跟楼上的想法差不多，横排好，转，然后把里边的内容转回来