overflow:hidden - the easiest way to clear floated elements

An oldie, but a goodie...

Simply stated, a container with the rule overflow:hidden applied to it will clear any floated elements inside it.

HTML:

<ul id="i_contain_floated_elements">
  <li>I float</li>
  <li>me too!</li>
</ul>

CSS:

#i_contain_floated_elements {
  overflow:hidden;
}
#i_contain_floated_elements li {
  width:100px;
  float:left;
}

Of course, display:inline-block can often negate the need to float at all.