您的位置:首页 > Web前端 > CSS

打败IE的葵花宝典:CSS Bug Table

2011-12-04 15:26 489 查看
问题:

<1>nput[button | submit] 不能用 margin:0 auto; 居中 <在ie8里> { bug|fixed}

解决方法:<1.> 为input添加width

问题:
<2>
body{overflow:hidden;}没有去掉滚动条 <IE6/7> { bug|fixed}

解决方法:<2>设置html{overflow:hidden;}

问题:

<3>hasLayout的标签拥有高度 <IE6/7> { bug|fixed}

解决方法:<3>*height:0;_overflow:hidden;

问题:

<4>form>[hasLayout]元素有margin-left时,子元素中的[input | textarea] 出现2×margin-left <IE6/7> { bug|fixed}

解决方法:<4>form > [hasLayout 元素]{margin-left:宽度;}form div{*margin-left:宽度÷2;}

问题:

<5>当border-width有1条<边3条时被设置成dotted时,1px的边dotted显示成dashed <IE7> { bug|fixed}

解决方法:<5>不在同一个元素上使用不同宽度的 dotte

问题:

<6>当子元素有position:relative的时候,父元素设置overflow:[hidden|auto]相当于给子元素设置了position:visible;<IE6/7> { bug|fixed}

解决方法:<6>给父元素设置position:relative;

问题:

<7>hover伪类不能改变有position:absolute的子级元素的left/top值 <IE7> { bug|fixed}

解决方法:<7>把top/left的值设置成除0%外的所有百分值;或添加一个margin-[所有方向]除0外的所有值,包括0%

问题:

<8>:focus + selector {} 选择器失效<IE8> { bug|fixed}

解决方法:<8>在失效选择器后面添加一个空选择器, :focus{}

问题:

<9>: 列表中混乱的浮动:在list中浮动图片时,图片出现溢出正常位置;或没有list-style <IE8> { bug|fixed}

解决方法:<9>用背景图片替换list-style

问题:

<10>:th 不会自动继承上级元素的 text-align<IE8> { bug|fixed}

解决方法:<10>给th添加text-align:inherit;

问题:

<11>:样式(包括link/style/@import(link)) 最多允许个为是:32 <IE6-8> { 常识}

解决方法:<11>99.99%的情况下,不会遇到

问题:

<12>:hover 时若background-color为#fff, 失效 <IE7> { bug|fixed}

解决方法:<12>把background-color改成background。或者,非#fff || #ffffff

问题:

<13>:忽略’>’后有注释的选择器:selector> /**/ selector{}
<IE6> { bug|fixed}

解决方法:<13>官方DEMO有误

问题:

<14>: * html <IE6> { ─ HACK}

解决方法:<14>只对IE6有效

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: