IE6/7 compatibility issues, what are the compatibility issues

1. Minimum height, less than 19 pixels IE6 automatically expands to 19 pixels.

Workaround: Overflow:hidden

2. Border point Line (IE6) is not supported (only one pixel when the problem occurs) dotted

Workaround: Cut the picture to do the background

3.margin problem: <div class= "box" ><div class= "div" >margin</div></div>

(1), margin is not displayed when the transfer. Workaround: 1. Parent "child" plus float:left;2.zoom:1;

(2), margin pass: When the parent has a border, the margin value of the child element disappears. Resolution: Parent plus zoom:1;

4.display:inline-block block labels are not supported under IE6/7. No workaround

5. Floating problem (1), IE6 double distance bug (block element has floating and horizontal margin value will be magnified twice times) resolved: Display:inline

(2), in Ie6/7 Li itself does not float, content has floated.     There is a gap resolution under Li 1: Add a float to the Li plus width. Resolution 2: Add Vertical-align:top to Li

(3), when the IE6 minimum height problem and the gap between Li coexist. Add float and width to Li

(4), when a row of sub-elements occupy the width of the sum and the width of the parent is more than 3 pixels (or there is a state of dissatisfaction with the last line of the child element of the next margin in IE6 failure) Resolved: No workaround

(5), IE6 text overflow bug. 1. When the width of the child element is smaller than the parent's width of 3 pixels.  2. Two floating elements have a comment or inline element in the middle. <div class= "box" > <div class= "left" ></div> <div><!--IE6 text overflow bug--><span></ span></div> <div class= "Right" >&darr;leo is a big fat </div> </div>

FIX: Use div to wrap comments or inline elements in Div.

(6). When a floating element is tied to an absolutely positioned element.  IE will disappear. FIX: Add a div to absolute positioning

6. Positioning

(1), IE6/7, the child element has a relative positioning, the parent overflow wrap child elements. Workaround: Also add a relative positioning to the parent:

(2), under IE6, the absolute positioning of the parent width is numbered when the element of right and bottom when there is a 1px deviation. Workaround: No workaround

(3), transparency problem IE:filter:alpha (OPACITY=70); opacity:0.7;

7. Table Form

(1), clear Google's border resolution: Outline:none;

(2), clear the Text field widen line solution: Overflow:auto;

(3), enter the type of form control under IE6/7, there is a pixel between the upper and lower. Workaround: Add float to input

(4), enter the type of form control under IE6/7, add border:none Invalid; Resolution: 1, border:0; 2. Reset the input background

(5), enter the type of form control under IE6/7 when entering text.   The background image will follow the text. Resolution: 1, add the background to the parent, and then clear their own background.

(6) The label cannot be used under IE6. Resolution: <input type= "Radio" name= "Gender" id= "a"/><label for= "a" > Men </label>

IE6/7 compatibility issues, what are the compatibility issues