CSS: Как заставить элементы списка не растягиваться по ширине на 100%?

Question

[ChemAli]

Есть обычный список UL. Нужно, чтобы элементы списка LI не растягивались на всю ширину контейнера UL, а были шириной по контенту, как на картинке:


Песочница у меня тут: jsfiddle.net/Gf54p

Answer 1

[Сергей]

ul {
border: 1px solid red;
background-color: #eee;
overflow: hidden;
}

ul li {
background-color: lightsteelblue;
margin-top: 2px;
border-radius: 2px;
display: block;
float: left;
padding: 5px;
clear: left;
}

Answer 2

[ChemAli]

float: left;
clear: left;

Answer 3

[ilyautkin]

Так, если надо, чтобы они выстраивались в строчку: jsfiddle.net/fp2DF/3
А так, если каждая должна с новой строчки начинаться: jsfiddle.net/fp2DF/4

Answer 4

[Илья Лесных]

а display: inline-block чем не прокатит?

Comments

[Сергей]

тем что inline видимо :)

Answer 5

[mazgolom345]

dispaly: block;
width: 100px;

po drugomu nikak ani blochnie elementttti

Comments

[Иван]

nu yasssnooo!