码迷,mamicode.com
首页 > 其他好文 > 详细

使用font-size:0去掉inline-block元素之间的空隙

时间:2016-05-13 07:37:29      阅读:121      评论:0      收藏:0      [点我收藏+]

标签:

现代浏览器的最新版都支持inline-block,只有该死的ie6、7不支持inline-block,但ie6、7可以通过

display:inline;
zoom:1;

 

来模拟


下面是inline-block兼容的代码:

 

view sourceprint?display:inline-block;

*display:inline;

*zoom:1;

width:100px;

vertical-align:top;

 


但是大家有没有发现,在firefox,safari,opera,ie8+中的 inline-block 元素之间会莫名其妙多出3px的间距,其实这个是换行符,如果将 inline-block 元素间的换行符去掉,这3px的间距就会消失了。


有没有在不影响代码美观的情况下去掉间距尼,答案是有的。

 

可以在inline-block的父元素中加上 :

 

 font-size:0;

 

然后在 inline-block 中将字体设回来。 

 

使用font-size:0去掉inline-block元素之间的空隙

标签:

原文地址:http://www.cnblogs.com/qiye2016/p/5484820.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!