tdにテキストがある場合、tdの高さを最小にする方法は？

Question

私が必要とするのは、16px TD（高さ）内の14pxテキストです。 空のtdでこれを実行しようとすると、これは動作しますが、テキストを入力すると、tdは自動的に20pxの高さになります。それは、私が望んでいない2ピクセルの上下の余白を残します。

HTML：

table{ 
    border-collapse: collapse; 
} 
td{ 
    background-color: #5589DC; 
    color:white; 
    font-family: Calibri; 
    font-size: 14px; 
    border: 1px solid black; 
    height: 16px; 
} 

これは結果である

<table> 
<tr><td>09:00 - 12:00</td><td>09:00 - 12:00</td></tr> 
<tr><td>09:00 - 12:00</td><td>09:00 - 12:00</td></tr> 
</table> 

CSS（20ピクセルのTD高さ）：

しかし、これは私が（塗料で修正さ16pxにtdの高さ（））何をしたいです：

任意のアイデア？

Answer 1

の変更高さの高さを与えることができます：16pxには、行の高さをする：13px、TD内のスペースを削減すること。

Answer 2

あなたはdivの上にテキストを入れて、DIVに16pxに

Answer 3

font-sizeに一致するようにline-heightを設定する必要があります。つまり、line-height: 14pxです。

table { 
    border-collapse: collapse; 
} 
td { 
    background-color: #5589DC; 
    color: white; 
    font-family: Calibri; 
    font-size: 14px; 
    line-height: 14px; 
    border: 1px solid black; 
    height: 16px; 
}