专注于WEB前端开发, 追求更好的用户体验, 更好的开发体验 (长沙前端QQ群:234746733)

IE与Firefox的CSS兼容

这里只记录了自己经常忽略的。

1.FF: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important 多设一个 height 和 width
2.cursor: pointer 可以同时在 IE FF 中显示游标手指状, hand 仅 IE 可以
3.ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值所以先定义ul{margin:0;padding:0;}就能解决大部分问题
4.让高度能自动适应,要在wrapper里面加上overflow:hidden;
当包含float的box的时候,高度自动适应在IE下无效,这时候应该触发IE的layout私有属性用zoom:1;可以做到,这样就达到了兼容。
例如某一个wrapper如下定义:.colwrapper{
overflow:hidden;
zoom:1;
margin:5px auto;}
5、margin加倍的问题。 
设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。
解决方案是在这个div里面加上display:inline;
例如:#IamFloat{
float:left;
margin:5px;/*IE下理解为10px*/
display:inline;/*IE下再理解为5px*/}

/ 分类: 开发 / TrackBackhttp://www.fantxi.com/blog/archives/600/trackback标签: ie, firefox

添加新评论 »