如何删除内联块元素之间的空格？

Question

鉴于此HTML和CSS：span {    display:inline-block;    width:100px;    background-color:palevioletred;}<p>    <span> Foo </span>    <span> Bar </span></p>结果，SPAN元件之间将存在4像素宽的空间。演示： http ：//jsfiddle.net/dGHFV/我理解为什么会发生这种情况，而且我也知道我可以通过删除HTML源代码中SPAN元素之间的空白来摆脱那个空间，如下所示：<p>     <span> Foo </span><span> Bar </span></p>但是，我希望CSS解决方案不要求HTML源代码被篡改。我知道如何用JavaScript解决这个问题 - 通过从容器元素（段落）中删除文本节点，如下所示：// jQuery$('p').contents().filter(function() { return this.nodeType === 3; }).remove();演示： http ：//jsfiddle.net/dGHFV/1/但是这个问题可以单独用CSS解决吗？

Answer 1

在元素之间添加注释以不具有空格。对我来说，比将字体大小重置为零然后重新设置更容易。

<div>

    Element 1

</div><!--

--><div>

    Element 2

</div>