IE8 layout / js bug

1. Ensure you're running IE8 in standards mode.
2. Insert element using innerHTML
3. Set attribute 'hello' to 'world' on the inserted element. Magic margin / padding appears!
4. Repeat the last step. The element appears to toggle between incorrect rendering and correct rendering.

• The bug doesn't seem to occur if the element is on the page to begin with.
• Although we're adding a made-up attribute, the bug occurs on any interaction with the element, including changes to the style property (where I first noticed the issue).
• Same happens if you select text on the page. Hit ctrl+a.
• Bug doesn't happen if the buggy element contains text in this example. Although I've seen examples where the bug still happens if the element has text.
• Alternatively, add the element using appendChild instead of using the innerHTML method above, the bug doesn't happen
• If you do the innerHTML method before the appendChild method above, the bug still happens, suggesting that the bug occurs on the containing element.
• If the element is created using innerHTML, but is inserted via appendChild, the bug doesn't happen