摘自 http://hi.baidu.com/wicker_wind/item/31a1f1da08302cfaca0c394b
这些都是我之前工作中平时收集总结的问题，如果读者你有更正或增加的请回帖补充
1. 使用img ul ul img排列时底部在IE6下有间隙
解决方法：.downloadCon ul,.downloadCon .downLinImg{100%; float:left;}
.downloadCon ul,.downloadCon .downLinImg{ clear:both; display:block;}
downLinImg为图片样式
去掉图片与容器之间的空格并给图片加上属性align="absmiddle"
2 使用img <ul><li>img</li></ul>排列时底部有间隙
解决方法：给li加高度
PS：善于使用初始化样式
3. LI之前有空隙：font-size:0;/*IE6下LI出现空白*/
4. 3象素BUG：vertical-align:middle;/*for ie6 3x bug*/
5. 针对IE6下PNG背景透明图片重复：
_background-image: none
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src="images/indexMainKbac.png",sizingMethod="crop");
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/bodyMainLine.png", sizingMethod="scale");
sizingMethod="crop":剪切图片以适应边界
sizingMethod="scale" 拉伸图片以适应边界
6 </ul><img src="images/nl_newsTypeBottome.gif" width="198" height="8" /></div>结构下ul与图片在IE6下有间隙：
div ul,div img{clear:both; display:block;}
7 DIV设置浮动后IE6下链接失效问题
设置浮动的DIV设置了PNG透明滤镜,在此DIV外面再加一个DIV并设置浮动，然后将所有的A标签都设置 position:relative;即可
8 绝对定位的DIV在IE与FF下位置不相符
margin:0
9 已设置为最底层的浮动FLASH在IE6下仍位于浮动层之上：
将浮动FLASH层代码放于应该浮动层之上即可
10 IE6下设置浮动层的时候，z-index大的反而在下面的情况：
1，父级层尽量相对body或本身的父DIV同级
2，设置父级DIV的z-index属性
*尽量不要在行内标签里嵌套块标签，保持代码语意规范
11 li标记中包含块级样式元素后带来的高度问题.
给<li>添加vertical-align:bottom;样式解决
12 IE6下3象素慢移
给出现BUG的DIV加zomm:1; 使用盒子模型，在出现BUG的DIV下面加CLEAR样式DIV(可能是IE6下浮动未关闭的原因)
13 css 如何显示客户端没有的字体:
@font-face { font-family : name ; src : url ( url ) ; sRules }
@font-face { font-family : name ; src : url ( url ) ; sRules }
14 DIV 中LI标签底部出现4PX
方法1 #list div设置clear:left|both，这时#list li不能设置width、height、zoom。 方法2
#list li设置float:left，这时#list li可以设置width、height、zoom。
#list li设置clear:left|both，这时#list li不能设置width、height、zoom。
方法3
IE6/IE7的这个Bug可以通过给li中的div设置vertical-align:top|middle|bottom解决。太怪异了，只要加上vertical-align的值是三者之一即可。
15 解决div内嵌套div的margin-top作用到父级DIV
<body style="margin:0;height:0;">
<div id="d0" style="background-color:#333333;height:500px;">
<br style="line-height:0;"/>
//不加入br这一行，在FIREFOX中id1的margin-top:20px将会在d0上作用，使d0上方与body间有20px的间距,d1与d0的上方没有间距，而IE内正常显示
<div id="d1" style="background-color:#000000;margin-top:20px;height:100px;"></div>
<div id="d2" style="background-color:#000000;margin-top:20px;height:100px;"></div>
</div>
</body>
16 FF不支持table的positon:relative属性
17 高度不能自适应
在外面加<div class=” grid”></div>
.grid:after{clear:both;
content:" ";
display:block;
height:0;}
18 margin 上面外边距折叠：设置父标签FLAOT属性
19 关于IE6下margin负值对象被隐藏的问题：结对象加position:relative
20 关于IE8FF下DIV嵌套出现外层自适应高度问题<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />
1） 给外层DIV加样式：display=table
2） 定义一个CSS类：
.box:after {
content: ".";
display: block;
height: 0px;
clear: both;
visibility: hidden;
}
然后将父层DIV代码中的<div id="main">改为<div id="main" class="box">。
3） 给外层div加个overflow:auto;
21 li设置float属性后ul的高度不能自适应li设置float属性后ul的高度不能自适应
1） 在ul 的样式里写上float:left，让ul 也飘浮；
2） 在ul的样式里写上100%; overflow:hidden; 这样也好用；