如何消除div和span之间的间隙

Question

在这个jsFiddle中，您可以看到其中包含一些span元素的div。

http://jsfiddle.net/9H9Tg/1/

为什么第一行和顶部div边界线之间有间隙？ 它是默认的行高吗？ 我在CSS课中没有设置行高。

http://h33i.img-up.net/Bildschirm4fda.png

如何在不同的浏览器中使用不同的字体消除这种差距？

    <div id="draggable-title2">
<span style="color: rgb(0, 0, 0); font-family: verdana; font-size: 40px; padding-top: 0px;display: inline-block;">
    Hello World 
    <br />next line
    </span>
    </div>

Answer 1

在css中添加

span{
    padding:0;
    line-height:30px;
}

演示

您也可以使用margin一样，

span{
    padding:0;
    line-height:33px;
    margin:-2px auto;
}

演示1

Answer 2

如果您只想固定顶部间距，请检查以下解决方案。

工作演示

代码更改：

<span style="color: rgb(0, 0, 0); font-family: verdana; font-size: 40px; padding-top: 0px;display: inline-block; margin-top:-10px;">

Answer 3

您可以使用css line-height来解决此问题

DEMO

 <span style="color: rgb(0, 0, 0); font-family: verdana; font-size: 40px; padding-top: 0px;display: inline-block;line-height: 30px;">