css - 元素宽度基于存在多少 sibling

Question

假设我有一个 500px 的 ul。说李子的是左浮。有没有一种方法可以编写 css，这样 li 永远不会转到第二行，而是根据 li 的数量填充 ul 的 500px 宽度？

例如。

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

li 将占据整个 500px

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

2 里将分割宽度。基本上每个 250px

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

将它拆分为 3 种方式等...

谢谢!

Answer 1

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

li {
    display: table-cell;
}

这是 fiddle :http://jsfiddle.net/WhbuQ/