相关疑难解决方法(0)

鉴于此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解决吗？

我已经制作了一个下拉列表:http://jsfiddle.net/QPxVe/ 由于某种原因,jsFiddle正在改变jsFiddle之外不存在的对齐 - 这不是问题.

我似乎在项目之间存在差距,我无法理解为什么要添加它.

小提琴有不同的颜色和字体,但除此之外,每个都是相同的.下图中的箭头指向问题 - 就像所有div一样.如果我为主.dropdown类设置边距为-4px,它是固定的,但我不确定为什么空间出现在第一位......