Issue One: Different browser tags default margin and padding are different
Workaround: * {margin:0; padding:0;}
Question two: IE6 double margin (block attribute +float+ horizontal margin)
Description: such as Div+css layout, <div style= "float:left;margin-left:10px;" ></div>, IE6 show the distance margin-left:20px
Workaround: _display:inline
Issue three: 3 pixels between floating and non-floating elements under IE6
Note: When an element floats, the same level of text does not float, and the IE6 creates a 3-pixel bug between them. such as: <div> test test </div>, then the picture and text will appear 3 pixels.
Workaround: CSS hack such as: <div><span style=" margin-right:5px; _ margin-right:2px; " > Test test </span></div>
Question four: IE6 tag has a minimum default row height
Note: When setting a label with a smaller height (typically less than 10px), the label height exceeds the height you set
Workaround: Set Overflow:hidden, or set row height line-height less than the height you set
Issue five: IE6 does not support min-height/max-height/min-width/max-width
Solution: {min-height:200px; height:auto!important; height:200px; overflow:visible;}
Question six: Picture is spaced by default
Description: When several IMG tags are placed together in a layout, some browsers will have default spacing
Workaround: Use the Float property for the IMG layout
Question VII: Compatibility of transparency
Workaround: filter:alpha (opacity=80);/*ie supports this attribute */
opacity:0.8;/* support for CSS3 Browser */
Common browser compatibility issues and workarounds (ongoing collection of updates)