Clearing a floated <li> correctly
Simply add overflow: hidden
to the ul
element's ruleset. Search for 'clearing floats' on Google or Stack Overflow for other solutions, though in this case this should be the cleanest.
jsfiddle demo: http://jsfiddle.net/9sxrN/1/