Shulou(Shulou.com)06/03 Report--

This article mainly explains "what are the common bug solutions to IE6". The explanation in this article is simple and clear, easy to learn and understand. Please follow the ideas of Xiaobian and go deep into it slowly to study and learn "what are the common bug solutions to IE6" together!

1, IE6 strange analysis of padding and border count width and height

Cause: Non-box model resolution due to lack of documentation declaration

Workaround: Add a document declaration

2. IE6 causes margin double (bilateral distance) when block element, left and right float and marin are set.

Solution: display:inline

3. The following three kinds of bugs are actually the same kind of bug. In fact, they are not considered bugs. For example, the parent label height is 20, the child label is 11, the vertical center is 20-11=9, and 9 should be assigned to the top and bottom of the text. How to divide? IE6 will be different from the others, so try to avoid it.

1) The height of the border with odd font size is less than 1px

Workaround: Set font size to even or line-height to even

2) line-height, text vertical center difference 1px

Solution: padding-top instead of line-height centered, or line-height plus or minus 1

3) Centering that differs from the parity of the parent label width causes a deviation of 1px

Workaround: If the parent label is odd width, the child label is also odd width; if the parent label is even width, the child label is also even width

4. When the internal box model exceeds the parent level, the parent level is enlarged.

Solution: Parent tag uses overflow:hidden

5, line-height Default line height bug

Solution: line-height setting

6. There will be a small blank between the line labels

Solution: float or structure side by side (poor readability, not recommended)

7, label height can not be less than 19px

Overflow: hidden;

8, left floating element margin-bottom failure

Solution: Display setting height or parent label setting_padding-bottom instead of child label margin-bottom or put another label to float parent label, child label

margin-bottom, i.e.(margin-bottom and float do not act on a label at the same time)

9, img in the block element, the bottom edge more blank

Workaround: Parent settings overflow: hidden; or img { display: block; } or_margin: -5px;

There will be a gap between 10 and li.

Solution: float: left;

11. Line elements with text and right floating in block elements, line elements newline

Workaround: Place line elements before text within block elements

12, position under the left, bottom dislocation

Workaround: Set the parent (relative layer) width and height or add *zoom:1

13. If position is set in the child level, the parent overflow will be invalid.

Solution: Set position:relative for parent

Thank you for reading, the above is "what IE6 common bug solutions" content, after the study of this article, I believe that we have a deeper understanding of what IE6 common bug solutions this problem, the specific use of the situation also needs to be verified by practice. Here is, Xiaobian will push more articles related to knowledge points for everyone, welcome to pay attention!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.