多列ul中的高度li相同

Question

我创建了一个muticolumn ul

HTML：

<ul>
   <li>Antelope</li>
   <li>Bison</li>
   <li>Camel</li>
   <li>Deer</li>
   <li>Eland</li>
   <li>Gazelle</li>
</ul>

CSS：

 ul {
   float: left;
   width: 12em;
   margin: 0;
   padding: 0;
   list-style: none;
 }

 li {
   float: left;
   width: 6em;
   margin: 0;
   padding: 0;
 }

现在，如果我在第二列（或第二列中的任何li）中添加更多文本，则整行会自动调整大小（行的高度调整大小）。但是如果我在第一列（或第一列中的任何li）中添加更多文本，则整行不会调整大小。

如果在任何li中添加或减少文本，我希望调整整行的大小。

我从this link.复制了上面的代码你可以看到多列ul的工作方式

Answer 1

也许添加：

li:nth-child(odd){clear:left;}

到您的CSS？

（这假设您只需要2列）