css3实现多个li纵向排列且可以自动换行

html代码：

<div class="box">
	<div class="item">1</div>
	<div class="item">2</div>
	<div class="item">3</div>
	<div class="item">4</div>
	<div class="item">5</div>
	<div class="item">6</div>
	<div class="item">7</div>
	<div class="item">8</div>
	<div class="item">9</div>
	<div class="item">10</div>
	<div class="item">11</div>
</div>

想要的排序结果是这样，并且行数是可控的
1　　10
2　　11
3
4
5
6
7
8
9

实现方法：

.box{display: flex;flex-flow: column wrap;height: 180px;overflow: hidden;}
.box .item{height: 20px;}

通过height来控制行数。