IE6双倍margin间距两大解决方案

开发 前端
本文向大家描述一下IE6双倍margin间距解决方法,这里主要从两个方面来向大家介绍,相信本文介绍一定会让你有所收获。

你对IE6双倍margin间距解决方法是否比较熟悉,这里和大家简单分享一下,希望通过本文的学习你对此解决方法有深刻的认识。

IE6双倍margin间距解决方法

方法1:

假设:一个div代码为

  1. <divstyledivstyle="float:left;margin-left:10px;"> 
  2. </div> 
  3.  

当一个css样式同时设置了float和margin的属性的时候,在ie7+及火狐上,该元素显示正常。但是在ie6下,将会出现双倍的margin-left属性值,也就是上面那段代码中的div在ie6下的实际margin-left的值是20px;

解决此办法的最简单的方法是,在style中添加:display:inline;

如上面的代码将改为

  1. <divstyledivstyle="float:left;display:inline;margin-left:10px;"> 
  2.  
  3. </div> 
  4.  
  5.  

 方法2:

可以使用以下办法来书写兼容浏览器的css代码:

***种

  1. :.div{  
  2. background:orange;/*ff*/  
  3. *background:green!important;/*ie7*/  
  4. *background:blue;/*ie6*/  
  5. }  
  6.  

 第二种

  1. :.div{  
  2. margin:10px;/*ff*/  
  3. *margin:15px;/*ie7*/  
  4. _margin:15px;/*ie6*/  
  5. }  
  6.  

 第三种

  1. :#div{color:#333;}/*ff*/  
  2. *html#div{color:#666;}/*IE6*/  
  3. *+html#div{color:#999;}/*IE7*/  
  4.  

【编辑推荐】

  1. 九步轻松解决IE6的各种疑难杂症
  2. 让IE6支持fixed的捷径
  3. IE6 IE7 IE8三个版本的CSS兼容速查手册
  4. IE6下使用CSS定义DIV高度行之有效的办法
  5. 技术前沿 一段JS代码轻松解决IE6-IE8的兼容性问题

 

责任编辑:佚名 来源: sytm.net
相关推荐

2010-08-25 11:36:19

IE6margin

2010-08-25 11:23:31

IE6margin

2010-08-27 09:02:22

IE6margin双倍

2010-10-08 16:31:08

AjaxIE6

2010-09-15 14:14:29

IE6position

2010-10-08 13:27:51

IE6pngJavaScript

2010-09-15 08:41:25

IE6IE7Firefox兼容

2010-08-27 13:31:58

IE6IE7Firefox

2018-02-05 22:21:38

物联网工业物联网数字化

2010-08-20 11:01:10

IE7IE8CSS

2010-09-16 10:50:55

CSS兼容IE6

2010-08-20 09:39:43

IE6IE7Firefox

2010-08-20 09:33:22

IE6IE7IE8

2010-08-18 14:14:41

IE6IE7FF

2010-08-19 10:40:36

position:fiIE6

2009-08-14 09:20:40

抵制IE6

2010-08-30 16:53:14

FirefoxIE8margin-top

2010-08-19 10:13:25

marginFFIE6

2010-08-26 12:59:29

marginCSS

2010-02-01 08:41:23

GoogleIE6
点赞
收藏

51CTO技术栈公众号