最近面试了几家公司，发现都爱问浏览器兼容的问题啊，哪个元素会有兼容问题，都能大约猜到，要我一个一个说，确是不能说太多，于是回家整理下以前的笔记，网上也找了些。 1. IE6下图片下方有空隙产生： 设
最近面试了几家公司，发现都爱问浏览器兼容的问题啊，哪个元素会有兼容问题，都能大约猜到，要我一个一个说，确是不能说太多，于是回家整理下以前的笔记，网上也找了些。
1. IE6下图片下方有空隙产生： 设置img 为display:block 或者设置vertical-align属性为vertical-align:top | bottom |middle |text-bottom
2. z-index在ie7 容易混乱，一定要给要给浮动的层的最上层的父级模块标签也写上z-index
3.在IE6及更早浏览器中无法定义小高度的容器？IE6及更早浏览器之所以无法直接定义较小高度的容器，是因为默认会有行高
解决方法：overflow:hidden;height:1px;font-size:0;line-height:0;
4. 当在IE6及更早浏览器中出现浮动后margin值解析为双倍的情况，设置该元素的display属性为inline即可（其实IE6都要淘汰了，没有必要再兼容IE6了，面试的时候说说，这个好多人知道，会比较得到不太懂前端的领导的认可）。
5. 早期浏览器不能实现min-height效果？这个有办法解决么？我一般就是针对该浏览器写个固定高度如 _height:500px;min-height:500px; 因为height是默认auto的，目前就遇到IE6不支持啊，有必要兼容么？注意不能再设置overflow的值为hidden，否则模拟min-height效果将失效
6. 按钮在IE7及更早浏览器下随着内容增多两边留白也随着增加的问题？解决方法：input,button{overflow:visible;}
7. IE7及更早浏览器下当li中出现2个或以上的浮动时，li之间产生的空白间隙的BUG？设置 vertical-align属性任何值都可以，还有button，checkbox，radio，img等元素，对不齐的，留空白间隙的，都试试这个属性，再调margin。
8. 如何解决IE6使用滤镜PNG图片不透明？用png-8格式
9. 如何解决IE7及更早浏览器下子元素相对定位时父元素overflow属性的auto|hidden失效的问题？
BUG重现：
===================================================
div{overflow:auto;width:150px;height:100px;border:1px solid #ddd;}
p{position:relative;margin:0;}
<div>
<p>IE7就可以看到这个BUG啦</p>
<p>IE7就可以看到这个BUG啦</p>
<p>IE7就可以看到这个BUG啦</p>
<p>IE7就可以看到这个BUG啦</p>
<p>IE7就可以看到这个BUG啦</p>
<p>IE7就可以看到这个BUG啦</p>
<p>IE7就可以看到这个BUG啦</p>
</div>
====================================================
如上代码，在IE7及更早浏览器下你会看到div的滚动条将无法工作。解决方案是给div也设置相对定位position:relative
10. float元素，一般兄弟元素，会跟随前面那个浮动，有时候一个div正好放2个块级元素，如果左边float:left;右边不写也会跟随浮动，但火狐就会掉下来。
CSS3标准中的，就不说了，大部分早前浏览器不支持
