なぜWebKitブラウザは、余分なパディング/マージンを使って、下をレンダリングするのですか？

Question

この問題は軽微ですが、私には迷惑をかけています。なぜWebKitブラウザは、余分な埋め込み/余白を付けて、次のように表示しますか？これを解決して高さを指定する唯一の方法は何ですか？

<div style="background-color:#efefef; width:200px;"> 
    <textarea style="padding:0px; margin:0px;"></textarea> 
</div> 

レンダリング：

Answer 1

<div style="background-color:#efefef; width:200px;"> 
    <textarea style="display:block;">asdf</textarea> 
</div> 

明らかに、<textarea>はインライン要素です。その隙間はベースラインの下の領域に見える。 display:block;を設定すると、ギャップがなくなります。

Answer 2

あなたはdiv要素に一致するように、テキストボックスの高さを設定してみてくださいましたか？それは高さを伝えるようには見えないので、デフォルトの高さ（divに基づいて）を使用している可能性があります。試してみてください。