Internet Explorer 6 Double Margin Fixed

When designing a website, authors take consideration that it will work on all web browser including old programs like Internet Explorer 6. A bug on double margin with Internet Explorer 6 will appear for the following reasons:

1. You have a DIV with the CSS Property float:left
2. The DIV is inside another DIV
3. Lastly, DIV is floating with Left Margin

What will happen?
margin-left: 10px; will be displayed as
<–20px—>

Example Code with Bug:
div.wrap{
width: 100%
}
div.main {
float: left;
margin-left: 10px;
}

Fixing the Bug:
div.wrap{
width: 100%
}
div.main {
float: left;
margin-left: 10px;
display: inline;
}

It happens when Internet Explorer render the margin twice. To fix it simply put an “inline” to a DIV property.