The ridiculous double margin bug that affects Internet Explorer finally has a cure. For those that haven’t seen it before, the gist is that sometimes an element that has a margin: and a float: property applied to it, instantly doubles the size of the margin value that matches the float – in other words, an element with a 10px left margin that also floats left, would mysteriously end up with a 20px left margin instead.
Anyway, Steve Clason seems to have found the solution to this and documented it at Position Is Everything. Fortunately, it’s simple indeed – you set the element to have a display: property of inline and subsequently setting float: left; implicitly changes the element back into a block element again.
Which then stops the margin from doubling in size. Somehow.