绝大多数的IE bug是因为haslayout http://dwz.cn/4Elg7X
而haslayout是ie6~ie7的属性，ie8已经废弃。
几个有用的链接:
CSS Hack Table https://swordair.com/tools/css-hack-table/
最全的CSS hack方式一览 http://blog.csdn.net/freshlover/article/details/12132801
常用的CSS Hack技术集锦 http://www.open-open.com/lib/view/open1412995165092.html
移动端1px细线解决方案 http://www.cnblogs.com/lunarorbitx/p/5287309.html
ie bug集合 http://www.w3cplus.com/solution/iebug/iebug.html
ie6,7,8 bug集合 http://www.cnblogs.com/orez88/articles/2563650.html
http://www.wufangbo.com/ie6-ie7-ie8-css-bug/
1.IE支持大部分特殊字符 ，firefox,chrome,opera,safari不支持 (opera可识别除外)。
2. \9 ：所有IE浏览器都支持
3. _和- ：仅IE6支持
4. * ：IE6、E7支持
5. \0 ：IE8、IE9支持，opera部分支持
6. \9\0 ：IE8部分支持、IE9支持
7. \0\9 ：IE8、IE9支持
下面的总结来自 CSS Hack大全&详解
各种CSS hack情况介绍
1.区别IE和非IE浏览器
2.区别IE6,IE7,IE8,FF
3.区别IE6、IE7、Firefox(方法1,方法2)
4.区别IE7、Firefox
5.区别IE6、IE7(方法1,方法2)
6.区别IE6、Firefox
CSS Hack常见的有三种形式：(总结来自:常用的CSS Hack技术集锦 )
CSS属性Hack、CSS选择符Hack以及IE条件注释Hack， Hack主要针对IE浏览器。
1、属性级Hack：比如IE6能识别下划线”_”和星号” * “，IE7能识别星号” * “，但不能识别下划线”_”，而firefox两个都不能认识。
2、选择符级Hack：比如IE6能识别*html .class{}，IE7能识别*+html .class{}或者*:first-child+html .class{}。
3、IE条件注释Hack：IE条件注释是微软从IE5开始就提供的一种非标准逻辑语句。比如针对所有IE：<!–[if IE]><!–您的代码–><![endif]–>，针对IE7以下版本：<!–[if lt IE 7]><!–您的代码–><![endif]–>，这类Hack不仅对CSS生效，对写在判断语句里面的所有代码都 会生效。
PS：条件注释只有在IE浏览器下才能执行，这个代码在非IE浏览下被当做注释视而不见。可以通过IE条件注释载入不同的CSS、JS、HTML和服务器代码等。
BFC的规则:
-
内部的Box会在垂直方向，一个接一个地放置。
-
Box垂直方向的距离由
margin决定。属于同一个BFC的两个相邻Box的margin会发生重叠 -
每个元素的margin box的左边， 与包含块border box的左边相接触(对于从左往右的格式化，否则相反)。即使存在浮动也是如此。
-
BFC的区域不会与float box重叠。
-
BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素。反之也如此。
-
计算BFC的高度时，浮动元素也参与计算
由于 CSS Hack,浏览器内核,兼容 产生的面试题
什么是BFC http://www.cnblogs.com/leejersey/p/3991400.html
什么是BFC http://www.cnblogs.com/pigtail/archive/2013/01/23/2871627.html
什么是BFC https://segmentfault.com/a/1190000004621361 (说的比较细致)
什么是BFC http://www.cnblogs.com/pigtail/archive/2013/01/23/2871627.html
使用display:inline-block在IE6中不能正常显示,如何解决?
CSS魔法堂：hasLayout原来是这样! http://www.cnblogs.com/fsjohnhuang/p/5291166.html ( BFC,IFC )
CSS魔法堂：重新认识Box Model、IFC、BFC和Collapsing margins http://www.cnblogs.com/fsjohnhuang/p/5259121.html
方法1:直接让块元素设置为内联对象呈递(设置属性display:inline),然后出发块元素的layout(如zoom:1).兼容浏览器的代码如下:
div{display:inline-block;*display:inline,*zoom:1;...}方法2: 先使用display:inline-block属性触发块元素,然后在定义display:inline,让
块元素呈递为内联对象(两个display要先后放在两个CSS样式声明中才有效果,这是IE的一
个经典bug,如果先定义了display:inline-block,然后在将display设回inline,layout不会消失)
代码如下:
div{display:inline-block;...} div{*display:inline}ie6中为什么不能设置1px高的div?
答: 在用DIV构建网页的时候,有时候需要的高度很小,这时候就可能会出现问题,因为,IE6下DIV有个默认的高度,大约是10-12px,当你试图定义一个高度小于 这个默认值的div的时候,IE会固执的认为这个层的高度不应该小于 字体的行高.
解决办法:
方法1:定义该div字体大小
<div style="height:1px;font-size:0;"></div>方法2:直接限制自动调整
<div style="height:1px;overflow:hidden;"></div>IE6双倍边距 IE6浏览器会出现双倍边距解决方法?
所谓的IE6双倍边距就是指当元素有float属性，又有margin属性时，在IE6下面显示的margin的值是设置值的两倍,这个问题从有css技术时就已经诞生.
<div style="width:200px;height:50px;background:#ccc;">
<div style="width:100px; height:50px;float:left;margin-left:10px; background:#eee;"></div>
</div>代码如下:
<div style="width:200px;height:50px;background:#ccc;">
<div style="width:100px; height:50px;
float:left;margin-left:10px;
background:#eee; display:inline"></div>
</div>第二种办法:
采用CSS Hack:
margin-left:20px;
_margin-left:20px;IE6中png问题?
答: 8种解决方案 http://18sucai.com/article/338.htm
3种解决方案: http://www.cnblogs.com/yuzhongwusan/archive/2009/04/17/1438119.html
PNG兼容IE6解决方法 http://www.cnblogs.com/amy-1205/p/5796635.html
CSS常见兼容问题解决方案?
http://www.jb51.net/css/97298.html
http://www.tuicool.com/articles/reiYR3m
http://blog.csdn.net/lysunnyrain/article/details/50962520
经常遇到的浏览器兼容有哪些?原因,解决办法是什么?常用的Hack技巧?
(1)png24位的图片在ie6浏览器上出现背景,解决方案就是做成png8
(2)浏览器默认的margin和padding不同,解决方案是加一个全局的*{margin:0;padding:0;}
(3)ie6双边距bug:块属性标签float后,又有横行的margin情况下,在ie6显示margin比设置的大;
(4)ie下,可以使用获取常规属性的方法来获自定属性,也可以使用getAttribute()来获取自定义属性;FF下,只能使用getAttribute()获取自定义属性;解决方法:统一通过getAttribute来获取自定义属性
(5)IE下,event对象有x,y属性,但是没有pageX,pageY属性;
FF下,event对象有pageX,pageY属性,但是没有x,y属性
解决方法:(条件注释)缺点是在IE浏览器下可能会增加额外的HTTP请求数
(6)Chrome中文界面下默认会将小于12px的文本强制按照12px显示,可通过加入css属性-webkit-text-size-adjust: none;来解决
浅谈一下怎么处理浏览器兼容性问题?
答: 合理化HTML结构,简洁化CSS属性: html结构合理规范了,很大程度上避免了兼容性问题,css要尽量写的简单有效,特效用JavaScript的来做,很多时候别用css伪类实现,针对 比较特殊的用CSS Hack处理.
<!DOCTYPE html>
<!--[if IE]>
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<![endif]-->
<!--[if IE 7]>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<![endif]-->
<!--[if IE 6]>
<meta http-equiv="X-UA-Compatible" content="IE=6" />
<![endif]--><!DOCTYPE html>是HTML5的声明，主流的游览器中只有IE8及以下版本不支持，
这样IE会进入Quirks模式。但之后的声明可以强制指定IE的呈现模式，
所以<!DOCTYPE html>声明对IE就无影响