Floating elements without defined widths
HTML
No defined width:
<ul>
<li>One Two Three</li>
<li>One Two Three</li>
<li>One Two Three</li>
<li>One Two Three</li>
<li>One Two Three</li>
</ul>
Defined width:
<ul class="b">
<li>One Two Three</li>
<li>One Two Three</li>
<li>One Two Three</li>
<li>One Two Three</li>
<li>One Two Three</li>
</ul>
CSS
ul {
overflow: hidden;
width: 250px;
border: 1px solid red;
}
li {
float: left;
background: orange;
border: 1px solid green;
}
.b li {
width: 80px;
}