If you read my last post, you know that I develop for IE6 and why. As is the case, IE6 throws annoying little gems at us, like its non-compliant box model, and the subject of today’s blog: the ever persistent double margin bug.

As the title alludes to, IE6 doubles the right and/or left margin on a floated element unless you declare:

display: inline;

Don’t worry about block-level items losing their width or height: they won’t. This isn’t a comprehensive explanation of the fix; it works for the conditions specified.