javascript - div と span の間のギャップを削除するにはどうすればよいですか

Question

この jsFiddle では、いくつかのスパン要素を含む 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

css を使用してこれを修正できますline-height

デモ

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