Yes they’re a dirty little web trick but clearing breaks can come in quite handy in these troublesome cross browser issue ridden days.

To learn more about floats and how they work have a read of this vanseodesign.com article.

So how to use them, well personally I declare 3 styles in my CSS

/*clear breaks*/
br.clearright{ clear:right; line-height:0;}
br.clearleft{ clear:left; line-height:0;}
br.clearboth{ clear:both; line-height:0;}

They obviously correspond to clearing left, right or both. Then when I have a section of code where I need to clear something I call one in.

</div>
<!--clear needed here//-->
<br />

Also take note of the line-height:0, this helps when IE likes to stick in padding and margins and borders and all sorts of other stuff you didn’t ask for!

Nice and simple!