星空网 > 软件开发 > 网页设计

讨论IE6/IE7中li底部4px的Bug

当li的子元素中有浮动(float)时,IE6/IE7中<li>元素的下面会产生4px空隙的bug。

XHTML    

<ul >  <li><div>vapour</div></li>  <li><div>百度</div></li>  <li><div>淘宝</div></li>  <li><div>迅雷</div></li></ul>

 

经过测试发现:li的子元素浮动是这个bu**生的必要条件,这个bu**生的充要条件是li的子元素浮动并且li设置了以下CSS属性之一:width、height、zoom、padding-top、padding-bottom、margin-top、margin-bottom。

           知道了这个bug的产生条件,所以解决方法也就有了:

  
     方法1  
     #list div设置clear:left|both,这时#list li不能设置width、height、zoom。  
     方法2  
     #list li设置float:left,这时#list li可以设置width、height、zoom。  
     #list li设置clear:left|both,这时#list li不能设置width、height、zoom。  
     方法3

 

   IE6/IE7的这个Bug可以通过给li中的div设置vertical-align:top|middle|bottom解决。太怪异了,只要加上vertical-align的值是三者之一即可。

 

讨论IE6/IE7中li底部4px的Bug
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html 讨论IE6/IE7中li底部4px的Bug

firefly



原标题:讨论IE6/IE7中li底部4px的Bug

关键词:ie

ie
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

亚马逊开始整改配送中心,FBA卖家或将受影响!:https://www.goluckyvip.com/news/897.html
东南亚主流电商消费群体研究:https://www.goluckyvip.com/news/8970.html
2023年,东南亚哪个市场还有“搞头”?:https://www.goluckyvip.com/news/8971.html
旺季赢战东南亚,本地收款,抢先一步!:https://www.goluckyvip.com/news/8972.html
东南亚各国对跨境税务政策加紧!:https://www.goluckyvip.com/news/8973.html
Shopee正式向卖家收取保证金,阿里巴巴在西班牙推出新出海平台Miravia :https://www.goluckyvip.com/news/8974.html
美众议院对TikTok“动手”,下一步该怎么在TikTok上营销?:https://www.kjdsnews.com/a/1836587.html
速卖通在韩国争议不断,投诉量激增两倍:https://www.kjdsnews.com/a/1836588.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流