CSS在IE6中的bug

1. 使用doctype
你应该在一直每个html文件的头部都使用doctype，并且我们推荐使用strict 版本，比如：

http://www.w3.org/tr/html4/strict.dtd">或者，对于xhtml使用:

http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd">你需要处理的最棘手的事情就是ie6进入quirks模式——它已经够诡异了。

2. 设置position: relative
将一个元素设置为”position:relative”可以解决很多问题，特别是你曾经遇到隐藏的或对齐诡异的盒子。显然，你需要非常小心点儿，因为绝对定位的子节点可能会因此重新定位。

3. 将浮动元素设置为display:inline
具有margin属性的浮动元素可能引起著名的ie6双倍margin问题，比如，你为一个元素指定margin-left为5px，但是ie6中实际上却表现为10px。”display:inline”将解决这个问题，尽管这不是必须的，你的css教程仍然是有效的。

4. 将一个元素设置为haslayout
很多ie6(和ie7)的渲染问题可以通过设置元素的haslayout来解决。 这是一个ie内部属性（ie隐藏的，更多关于haslayout的资料，可以参阅这里），用来确定相对于其他元素，内容是如何布局和定位的。如果你需要设置一个inline元素(比如一个链接)为block元素，或者是应用透明效果，设置haslayout也可能是必须的。

最简单的设置haslayout的方法是为css设置一个高度或宽度（zoom也可以用，但是zoom并不是css标准的一部分）。我们推荐设置实 际尺寸，但是问题是这是不现实的，你可能需要使用”height:1%”。如果父元素并没有设置高度，该元素的实际高度并不受影响，而且这个时候 haslayout已经被启用。

5. 修正重复文字bug
复杂的布局可以触发在浮动元素的最后一些字符可能出现在出现在清除元素下面的bug。这里有几个解决方法，有些是完美的，但是做一些反复试验也是必须的：

确保所有的元素使用”display:inline;”
在最后一个元素上使用一个”margin-right:-3px;”
为浮动元素的最后一个条目使用一个条件注释，比如：                在容器的最后元素使用一个空的div(它也有必要设置宽度为90%或类似宽度。)

6. 在可点击和悬停的元素上只使用标签
ie6只认识对a标签的css hover效果。

你也可以在基于网页特效的组件内使用他们来控制，以使他们保持键盘的可操作性。是有一些可替代的选择，但是标签比其它方案更可靠。

body {       margin: 2% 0 !important;       margin: 20px 0; /* ie6 only */}9. 尽早测试并不断测试
不要等到你的网站或应用完成了才测试ie6;这样的话问题可能更糟糕，而且会花更多时间来修正。如果你的网站能够在firefox和ie6中正常运行，那么一般在其它浏览器就不会有问题。