元素宽度取决于存在多少兄弟姐妹

Question

说我有一个500px的ul.说孩子李是漂浮的.有没有办法写css所以li永远不会去第二行但是根据有多少li来填充ul的500px宽度？

例如.

<ul>
   <li>test</li>
</ul>

李将占用整个500px

<ul>
   <li>test</li>
   <li>test</li>
</ul>

2 li会分开宽度.基本上每个250px

<ul>
   <li>test</li>
   <li>test</li>
   <li>test</li>
</ul>

会分三种方式......

谢谢!

Answer 1

ul {
    width: 500px;
    display: table;
}

li {
    display: table-cell;
}