本文和大家重点讨论一下margin在FF/IE6/IE7中的兼容,设置为float的DIV在IE下设置的margin会加倍。这是一个IE6都存在的bug。这里总结了两个解决方案希望对你的学习有所帮助。
margin在FF/IE6/IE7中的兼容
设置为float的DIV在IE下设置的margin会加倍。这是一个IE6都存在的bug。解决方案我总结了两个,当然可能还有其他的方法,知道的可以留言分享呵呵。
解决方法一:
是在这个DIV里面加上display:inline。
如:
- <#DIVid=”imfloat”>
- 相应的css为
- #imfloat{
- float:left;
- margin:5px;/*IE下理解为10px*/
- display:inline;/*IE下再理解为5px*/}
解决方法二:
通过!important这样的手段hack。(这里面有3种形式)
***种:
- .DIV{
- background:orange;/*ff*/
- *background:green!important;/*IE7*/
- *background:blue;/*IE6*/
- }
第二种:
- .DIV{
- margin:10px;/*ff*/
- *margin:15px;/*IE7*/
- _margin:15px;/*IE6*/
- }
第三种:
- #DIV{color:#333;}/*ff*/
- *html#DIV{color:#666;}/*IE6*/
- *+html#DIV{color:#999;}/*IE7*/
【编辑推荐】
- IE6不支持的五大CSS选择符
- 探究IE8与IE7具体功能中窗口功能按钮的变化
- IE6 IE7 IE8三个版本的CSS兼容速查手册
- IE6下使用CSS定义DIV高度行之有效的办法
- 技术前沿 一段JS代码轻松解决IE6-IE8的兼容性问题