1：li 边距“无故”增加
任何事情都是有原因的，li边距也不例外。
先描述一下具体状况：有些时候li边距会突然增 加很多，值也不固定（只在IE6/IE7有这种现象），让人摸不着头脑，仔细“研究”发现是由于其 低级元素ul的padding引 起，padding的上下值对li有影响，左右无影 响。所以只好笨手笨脚地把padding去掉，换成margin。 这是能解决问题，但往往不是我们想要的结果，或许 还会引起其他不必要的怪现象。
现在终于发现解决这个问题的方法，其实很简单，既然是有ul引 起的，就设置ul的显示形式为*display:inline-block;即可，前面加*是只 针对IE6/IE7有效，其他浏览器并不渲染这个属性。
2：分页数字 字体用“Arial ”加粗不抖动
CSS：
body, ul, h1 {
font-family:Arial;
font-size:12px;
}
.page {
text-align:center;
}
.page a {
display:inline-block;
padding:5px 8px;
text-decoration:none;
border:1px solid #09F;
background-color:#0CF;
color:#FFF;
}
.page a:hover, .page .selected {
border:1px solid #CCC;
background-color:#FFF;
color:#000;
font-weight:bold;
}
HTML：
分页样式
1
2
3
4
5
6
7
8
9
10
3：IE6 CSS选择器区分IE6
IE6不支持子选择器；先针对IE6使用常规申明CSS选择器，然后再用子选择器针对IE7+及其他浏览器。
/IE6 专用 /
.content {color:red;}
/ 其他浏览器 /
div>p .content {color:blue;}
4：IE6最小高度
IE6不支持min-height属性，但它却认为height就是最小高度。解决方法：
使用IE6不支持但其余浏览器支持的属性!important。
#container{min-height:200px; height:auto !important; height:200px;}
5：IE6100% 高度
在IE6下，如果要给元素定义100%高度，必须要明确定义它的父级元素的高度，如果你需要给元素定义满屏的高度，就得先给html和body定义height:100%;
6：IE6躲猫猫bug
在IE6和IE7下，躲猫猫bug是一个非常恼人的问题。一个撑破了容器的浮动元素，如果在他之后有不浮动的内容，并且有一些定义了:hover的链接，当鼠标移到那些链接上时，在IE6下就会触发躲猫猫。
解决方法很简单：
- 在（那个未浮动的）内容之后添加一个
- 触发包含了这些链接的容器的
hasLayout，一个简单的方法就是给其定义height:1%;
7:IE6绝对定位元素的1像素间距bug
IE6下的这个错误是由于进位处理误差造成（IE7已修复），当绝对定位元素的父元素高或宽为奇数时，bottom和right会产生错误。唯一的解决办法就是给父元素定义明确的高宽值，但对于液态布局没有完美的解决方法。
8: IE下z-index的bug
在IE浏览器中，定位元素的z-index层级是相对于各自的父级容器，所以会导致z-index出现错误的表现。
解决方法：
其父级元素定义z-index，有些情况下还需要定义position:relative
9: Overflow Bug
在IE6/7中，overflow无法正确的隐藏有相对定位position:relative;的子元素。
解决方法：
给外包容器.wrap加上position:relative;。
10: 横向列表宽度bug
如果你使用float:left;把hasLayout，在IE6下就会有错误的表现。
解决方法：
给float:left;
11: 列表阶梯bug
列表阶梯bug通常会在给float:left;时触发，我们本意是要做一个横向的列表(通常 是导航栏)，但IE却可能呈现出垂直的或者阶梯状。
解决办法：
给float:left;而非子元素display:inline;也可以解决。
12: 垂直列表间隙bug
当我们使用IE6(IE7也有可能)会错误地给每条列表元素（
解决方法：
方法1：.clear{clear:both;}清除float来解决这个问题；
方法2：触发hasLayout（如定 义高宽、:使用zoom:1;）;
方法3：给display:inline;来解决此问题；另外还有一个极有趣的方法，给包含的文本末尾添加一个空格。
13: IE6调整窗口大小的 Bug
当把body居中放置，改变IE浏览器大小的时候，任何在body里面的相对定位元素都会固定不动了。
解决办法：
给body定义position:relative;
14: 文本重复Bug
在IE6中，一些隐藏的元素（如注释、display:none;的元素）被包含在一个浮动元素里，就有可能引发文本重复bug。
解决办法
给浮动元素添加display:inline;
15：如何去掉点击链接时的虚线
在 CSS 中加入如下代码：
:focus{{ouline:0;}
a,a:hover{outline:none; blur:expression(this.onFocus=this.blur());}
16：css reset中的list-style:none
在IE6,7下
1)当ul不具有float:left;display:inline;时,
无论有没有list-style:none这个属性,列 表符都被隐藏,不占位置
2)当ul具有float:left;display:inline;属性时,
list- style:none,列表符被隐藏,但是仍然留有位置(list-style-position:inside);
未设置list-style:none;列表符被隐藏,也不占位(list-style-position:outside)
在firefox中只要list-style-type为none ,则 无论list-stype-position的值为outside或inside , list-style都能很好的被隐藏
而在IE6,7中,仅 设置list-style:none,并不足以解决所有问题
在css reset的时候使用 list-style:none outside none 更好
17: IE6中伪类:hover的使用及Bug
以前未曾遇到类似的问题，一番google，才知道这是IE6处理CSS伪类:hover的Bug。例如如下的代码：
a {color: #333;}
a span {color: green;}
a:hover {}
a:hover span {color: red; }
淘宝网 淘你喜欢
在IE7/FF中，鼠标移动到链接上时，”淘你喜欢”字样会变为红色，但IE6则无反应。所以IE6的bug就是如果a 与 a:hover的css定义是一样的，也就是说如果a:hover 中没有样式的改变，hover就不会被触发。但如果在a:hover{}增加一些特定的属性，例如
a:hover{border:none;}
或者
a:hover{padding:0;}
又或者
a:hover{background: none;}
此时hover就可以触发了。
18:去掉button按钮左右两边的留白
input,button{overflow:visible;padding:0;}
19:中文字体在css中的写法
黑体SimHei\9ED1\4F53黑体 宋体SimSun\5B8B\4F53宋体
新宋体 NSimSun\65B0\5B8B\4F53新宋体 仿宋FangSong\4EFF\5B8B仿宋
楷体KaiTi\6977\4F53 楷体
微软正黑体Microsoft JhengHei\5FAE\x8F6F\6B63\9ED1\4F53微软正黑体
微软雅黑Microsoft YaHei\5FAE\8F6F\96C5\9ED1微软雅黑 幼圆 YouYuan\5E7C\5706幼圆
20:IE6下css实现max/min-width/height
_width:expression(this.width>300?"300px":ture); max-width:300px;
_height:expression(this.height>300?"300px":ture); max-height:300px;
来自 http://www.wufangbo.com/ie6-ie7-ie8-css-bug-2/
