解决行内元素存在间隙的bug问题

行内元素之间会产生间隙bug问题的场景:

1、当行内元素之间有“回车”、“tab”、“空格”时就会出现间隙。

如下代码:

1

22

333

解决办法有两种

方法一:将元素写成一行,中间不换行;

12233

方法二:设置font-size:0

div{font-size:0px;}

a,em{font-size:10px;}

方法三:可以为元素设置负margin值,一般为-4,但是根据父级元素的font-size会有相应的变化,使得元素间隙消失

a,em{font-size:10px;margint-right:-4px;}

这个方法对于盒模型比较怪异的IE6/7来说另当别论。

方法四:省略闭合符号

当然,还有让内联元素浮动float:left;的办法,此时父级容器需要设置宽高,才好定位内联元素的位置。感兴趣的朋友可以一试。

你可能感兴趣的:(解决行内元素存在间隙的bug问题)