floated element in IE

floated IE FireFox margin

[chrislinzh]

I set an element with 5px margin without float, it looks good in IE and Firefox. If I set it with {float: left},IE add 3px at the leftside margin,but Firefox don't.
How to slove this problem?

[benihana]

add :

display:inline;

after the

float:left;

[chrislinzh]

Yes,it works,thanks a lot

[benihana]

Didnt have much time when i posted yesterday, but for the sake of clarity Im guessing IE was adding an extra 5px of margin to the left.

This is caused when you have a margin on the same side as you are floating towards, in this case 5px all round (including the left) and float:left;. In this circumstance IE doubles the margin on that side - making it 10px.

Adding display:inline; bizarrely fixes this bug, yet the element still retains its block status bought on by the float.