10 solutions compatible with IE6

Http://www.sitepoint.com/blogs/2009/03/06/10-fixes-for-ie6-problems/
Author: Craig buckler Translation: Qing
We know that IE will remain popular for a while, but can we still support browsers and avoid hacks and conditional CSS? There are 10 valid HTML and CSSCodeFixes common problems that are compatible with Internet Explorer 6.

1. Use a statement
You must always place a statement in the header of an HTML webpage. Strict standards are recommended. For example

Or use XHTML

Finally, you need to enter the compatibility mode for IE6, which is compatible enough.

2. Use Position: relative
Setting a label position: relative can solve many problems, especially frameworks with invisible experiences or strange la S. Obviously, you need to be careful to check whether all the sub-elements in the absolute position are found in the new position.

3. Use display: Inline for floating Elements
The floating element has a famous IE6 bilateral margin bug. If you set the left margin of 5px, but the left margin of 10px is actually obtained. Display: inline can solve this problem. Although it is not necessary, CSS still works.

4. Set the element to start haslayout.
Most rendering problems of IE6 (IE7) can be achieved through the haslayout attribute of the element. This is the built-in setting of IE. It determines that a content block has a line and a position relative to other content blocks. When you need to set an element in the row, such as a connection that turns into a block element or a transparent effect, setting haslayout is also required.

5. Fixed the bug of repeated characters.
A complicated layout triggers a bug: The final character of the floating object appears after the floating element has been cleared. There are several solutions here, some of which are ideal, and some tests and errors are required.
A. Make sure that all floating elements use: Display: inline;
B. Use margin-Right:-3px For The Last floating element;
C. Use a condition annotation after the last element of the floating object. For example, enter a comment... <! [Endif]
D. Use a div empty label at the end of the container (it must also be set to 90% width or even smaller)

6. Use the tag to complete clickable and hover principles
IE6 only supports CSS defining hover effects of tag.
You can use it to control the widgets started by JavaScript so that they still maintain keyboard operations. There is a two-choice problem here, but tag a is the most reliable in all solutions.

7. Use it! Important, or an advanced selector to replace specific ie code
In an external CSS file, it is still possible to use valid CSS code to target IE6 without relying on the traditional hacks and condition judgment. For example, the minimum height can be defined as follows.
# Element {
Min-Height: 20em;
Height: Auto! Important;
Height: 20em;
# Element [ID] {
Height: auto;
}

8. Avoid definition of percentage
The percentage is messy in IE. Unless you are very careful about the size of each parent element, this will probably be avoided in the end. You can still use other browsers! Important to use a hundred points. For example:
Body {
Margin: 2% 0! Important;
Margin: 20px 0;
}

9. Early and frequent tests
On your website and ApplicationProgramDo not discard the IE6 test before it is completed. The problem will be more serious and it takes a long time to fix it. If your website can run on Firefox and IE6, it will certainly run on other browsers.

10. refactor your code
often, fixing will take more time than new layout problems. Slight HTML modifications and simpler CSS are often the most effective. This means you have to discard the perfect legal code, but there will be fewer problems and you know how to handle the situation.