html同行div不同宽高,html – 不同的高度div在两列中浮动

我有两列,想按照外观的顺序堆叠不同高度的div.

动态创建div.

如果我只将它们漂浮在宽度的50％,那么我很快就会遇到这样的情况：div#4比传入的几个div高5倍.然后下一个div与上一个div的底部顶部对齐.

我需要将容器中的小孩子div设置为完全匹配：

----- -------

1 2

-----

3 -------

----- 4

5

-----

6

-----

7 -------

----- 8

9

-----

10 -------

11

-------

-------

-----

这是代码片段我做了什么：

.Box {background:#20abff; color:#fff; width:50%; margin: 5px;}

.left {float:left;}

.right {float:right;}

.container {width:205px;}

1

2

3

4

5

6

7

8

9

它看起来类似于此

欣赏帮助