基於存在多少個兄弟姐妹的元素寬度

Question

假設我有500px的ul。說孩子李是浮着的。有沒有一種方法可以編寫css，這樣li就不會去第二行，而是根據有多少個li來填充ul的500px寬度？

例如。

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

鋰會佔用整個500px的

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

2裏將分裂寬度。基本上每個250像素每

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

將它分成3種方式等等

謝謝！

Answer 1

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

li { 
    display: table-cell; 
} 

這裏的小提琴：http://jsfiddle.net/WhbuQ/

Answer 2

當Flexbox變得敲定/更好的實現，它也提供了一個很好的選擇。

fiddle使用當前Gecko/Webkit支持的舊式語法。