1、ie6/7由注释引起的文字错位：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>多了一只IE6猪</title>
</head>
<body>
<div style="width:400px">
<div style="float:left"></div>
<!-- -->
<!-- -->
<!-- -->
<div style="float:right;width:400px">↓这就是多出来的那只IE6猪</div>
</div>
</body>
</html>
这是个经典的例子。IE6在使用一大堆注释放在包含在同一个DIV的不同元素之时就会这样，重复一些文字在文字的顶或底部。
我在ASP生成HTML的循环语句中使用了一段注释，结果在IE7下显示整个DIV顶部像空了一截，底部正常，而IE6则顶部空一截，底部还有重影文字，就像上面多出现的猪一样。
解决方法是：去掉注释或者注释不要放置于2个浮动的区块之间。
2、IE6中浮动时产生双倍边距的解决
当有一个层的外边距在设置的时候跟该层的浮动方向相同时，就会出现这种情况，如：
会出现以下现象
解决方法如下：
3、IE继承外边距bug:有表单元素和外层
该BUG是这样的：
如果表单元素input的外层的左边距存在，那么input就会产生一个左边距，而这个边距的大小是外层左边距的两倍。如以下例子：
.has-margins { background-color: gray; margin-left: 5em; padding: 1em; }
.has-layout { background-color: tan; width: 30em; }
<form action="ignore"> <div class="has-margins"> <div class="has-layout"> INPUT tag, type=text:<br> <input type="text"><br> INPUT tag, type=checkbox:<br> <input type="checkbox"> </div> </div> </form>
会出现以现情况：
如果把代码改成以下情况：
<form action="ignore"> <div class="has-margins"> <div class="has-margins"> <div class="has-layout"> INPUT tag, type=text:<br> <input type="text"><br> INPUT tag, type=checkbox:<br> <input type="checkbox"> </div> </div> </div> </form>
解决方法：
a、在input元素前面添加任何文本元素和inline级的元素
<form action="ignore"> <div class="has-margins"> <div class="has-layout"> INPUT tag, type=text, preceeded by inline text:<br> Text: <input type="text"><br> </div> </div> </form>
b、用一个元素（无论是inline还是block级的）来包住input表单元，如下：
<form action="ignore"> <div class="has-margins"> <div class="has-layout"> INPUT tag, type=text, wrapped in an unstyled SPAN:<br> <span><input type="text"></span><br> </div> </div> </form>
