我有一个列表,我想从中构建两列.
列表中可以包含可变数量的项目,但最大值. 8
列表中可以包含可变数量的项目,但最大值. 8
我总是希望第一列有4个元素.
我已经尝试过列计数：2但是这对于不均匀的数字不起作用,因为第一行必须包含4个元素.
.container {
border: 1px solid red;
width: 300px;
height: 90px;
}
<div class="container">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</div>
解决方法
您可以使用display：flex：
ul {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
flex-wrap: wrap;
width: 300px;
height: 200px;
}
li {
height: 25%;
}
<div class="container">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
</ul>
</div>
