如何消除内联块元素之间的差距

tim*_*ong 3 css gaps-in-visuals

.item-list {
  letter-spacing: -0.3em;
}
.item-list a {
  letter-spacing: 0;
  display: inline-block;
}
Run Code Online (Sandbox Code Playgroud)
<div class="item-list">
  <a href="#">a</a>
  <a href="#">a</a>
  <a href="#">a</a>
  <a href="#">a</a>
</div>
Run Code Online (Sandbox Code Playgroud)

只有在win ie6中,它们之间的差距a 仍然是退出,风格letter-spacing:-0.3em在删除时会有效a { letter-spacing:0 }

为什么?我可以弄清楚这个问题吗?

pep*_*eam 13

哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇

字体大小:0; 必须添加到父元素

在您的示例中,我将分别定义a标签的字体大小,并添加"font-size:0;" 到父div元素

换一种说法:

CSS:

.item列表{字母间距:-0.3em; 字体大小:0;}

.item-list a {letter-spacing:0; display:inline-block; font-size:SOMETHING更高;}

(也是你的DOCTYPE声明必须正确或显示内联块可能在IE中有问题,至少我用IE7遇到了麻烦)

这应该结束您从显示中遇到的任何额外的保证金挫折:内联块;