pc样式在ie8中的bug

pc样式在ie8中的bug

 

1,box-sizing:border-box:

    在ie中,此属性的使用有限制:

    (在IE8中，min-width属性适用于content-box即便box-sizing设置为border-box。    

    Chrome select在使用时从元素中选择选项时遇到问题box-sizing: border-box，而且浏览器缩放级别低于100％。

    IE 8忽略box-sizing: border-box是否使用min / max-width / height。当设置为position：absolute / fixed，overflow：auto / overflow-y：scroll时，IE9将减小滚动条的宽度为元素的宽度

    Safari 6.0.x不对带有display：table的元素使用框大小;Android浏览器没法正确计算HTML选择元素的尺寸（宽度和高度）。)

所以,在设置元素的宽高时,让内容居中,用padding值实现并非最好.最好用定高度,line-height属性设置居中.以防止在ie中元素尺寸变大.

所以在pc中,应该不使用border-box属性.

 

注:width:50px; 在ie中,至关于 min-width:50px;

 

2.即便float过的元素,在ie8中依然会有原始的宽度,而再也不同一行;所以应显示定义宽度,

 

3,针对ie 的属性不兼容,能够采用覆盖操做,利用'*','_','!important'等进行属性值的覆盖.

 

4,

低版本的IE只对自己inline的元素能用inline-block，而自己为block的元素须要设为inline。此外，若是想要让这个buggy的inline-block生效，还须要让元素具有hasLayout，常见的方法是设置zoom。若是想绕太低版本IE又保持对其余浏览器的兼容，能够这样：

.xx { display: inline-block; *display: inline; // IE7- only hack zoom: 1; }

应该加入样式重置中.