次のように、テーブルセルの下に入力要素があります。
<td><input class="form-control input-small my-input-narrow" type="number"></td>
残念ながら、このセルは、入力要素の幅よりもはるかに広い列の幅を決定します。
Chrome で要素を調べると、計算されたスタイル タブに次のように表示されます。
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
ただし、メトリクスの下に移動してビジュアルを見て、マージンにカーソルを合わせると、マージンの幅として「-」と表示されているにもかかわらず、マージンとして広い領域が表示されます。td の計算されたスタイルの幅は 219px です (入力要素自体は 33px です)。
レンダリングがなぜそうであるかをよりよく理解するための提案はありますか?
ありがとう!