错误修正：IE双边距浮动错误

Posted 2021-02-27

It’s an Internet Explorer-exclusive bug wherein an element that is floated – and given a margin in the same direction as the float – ends up with twice the specified margin size. The fix is extremely simple. All you have to do is apply a display: inline rule to your floated element.

/*
   Instead of this
*/
#content {
	float: left;
	width: 500px;
	padding: 10px 15px;
	margin-left: 20px;
}
 
/*
   Do this
*/
#content {
    float: left;
    width: 500px;
    padding: 10px 15px;
    margin-left: 20px;
    display:inline;
}