[CSS, HTML]Распределение Inline элементов внутри резинового блока.

Имеется вот такая конструкция:

<ul>

<li>fs</li>

<li>asdfoi2134231</li>

<li>asdfk23423</li>

<li>dfgjkp;234lkdsaf</li>

<li>dfkjglkq324523kjsd</li>

<li>sdfs</li>

<li>234k</li>

<li>sdfsklk;lksdf</li>

....

</ul>

Style:

ul{

 display:block;

}



ul li{

 dilspay:inline-block;

}

При этом получается вот такая картина:

А хочется что бы было вот так:

Поясню:

1. Все элементы должны подстраивать свою ширину под ширину самого длинного элемента, таким образом что бы все смотрелось как будто в колонки, 2. количество которых должно менятся в зависимости от ширины блока или от длины наиболее длинного элемента.

Не спрашиваю о возможности реализации, спрошу: как мне такое провернуть?

Заранее благодарю за ответы.