Clearing floats have always been an annoyance for us as web developers, because it requires us to use empty markup. It wouldn’t be that much of a problem, except that using floats for complex css layouts has become somewhat of an industry standard.
Not too long ago a new trick came along which had many css developers feeling lighthearted – a way to clear floats without markup. It was a simple, reliable css method that’s been around for ages – the overflow property. Simply by declaring this (usually to auto or hidden), you are able to extend the parent div over the floated divs, and effectively clear your divs – something you have previously needed an empty block level html element to accomplish.