Bug: 3px spacing between floating elements in IE6_html/css_WEB-ITnose

Occurrence: An element floats, and then a non-floating element naturally floats up and close to the 3px gap that will appear.

The following are personal tests:

test01: Non-floating elements are block-level elements

<div class="box01">box01</div><div class="box02">box02</div>

.box01{float: left; background: #f1c100;}.box02{background: red;}

ie6 effect: 3px spacing does not appear

test02: not floating The element is modified to an inline element

<div class="box01">box01</div><span class="box02">box02</span>

.box01{float: left; background: #f1c100;}.box02{background: red;}

ie6 effect: 3px spacing appears

test03: Repair this 3px spacing (Method 1)

The html structure is according to test02, and the css is as follows:

.box01{float: left; background: #f1c100;}.box02{background: red;_margin-left:-3px;}/*_margin-left:-3px;修复3px间隔bug*/

Effect: No spacing

test04: Repair this 3px spacing (Method 2)

The structure is the same as above, the css is as follows :

.box01{float: left; background: #f1c100;}.box02{background: red;float: left;}/*让不浮动元素也浮动起来*/

Effect: No spacing

Summary:

Based on this, this bug can be improved. Occurrence situation: an element floats, and then a non-floating inline element naturally floats up and close to the 3px gap that will appear.