double margins in IE6

This is a special feature in IE6. If you have an element set to float: left, and specify a left margin for that element,  IE6 will kindly double that left margin for you.So for example:

 <div style="float: left; margin-left: 10px">hello world</div>

will have a left margin of 20px in IE6. A useful feature I'm sure you'll agree. Once you have had your fill of this IE based delicacy you can fortunately remove it using this little gem:

 <div style="float: left; margin-left: 10px; display: inline">hello world</div>

Yes, thats right the humble display: inline is all you need. Of course if for some reason you can't use display: inline; you will have to use some IE specific css that has the left margin set to half of what you really want it.

Post a comment