Internet Explorer 6 Double Margin Fixed
About: 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. [...]
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.
