1

Chrome が span タグにパディングを追加する方法に矛盾があることを発見しました。小さいフォント サイズとテキストで単純な span タグを使用すると、上下のパディングが Internet Explorer よりも大きくなります。大きな font-size を使用する場合、パディングは同じです。

これは、次のコード/jsfiddle でテストできます。

<span>Testing A Text</span>
<span>Testing A Text</span>

body
{    
    font-family: Helvetica,Arial,"Sans Serif";
    font-size: 10px;
}
span
{
     border: 1px solid red;   
}
span:last-child
{
    font-size: 200%;
}

(ここでプレビューできます: http://jsfiddle.net/gR9em/5/ )

もちろん、これは条件付き CSS や別のフォントを使用することで解決できますが、それはできれば避けたいことです。これは「Arial」に関連している可能性があります...しかし、誰かがこれを説明し、おそらく解決策を提供できますか? それとも、これは既知のブラウザー CSS の「バグ」ですか?

画像付きの例:

プレビュー

4

2 に答える 2

0

Chrome で jsFiddle を再度テストしましたが、この問題を投稿したときよりもテキストの下のパディングが消え、テキストの上のパディングが少なくなっているようです。Chrome で何かが更新された可能性があります。

line-height は、理想的には異なるブラウザー間で異なる動作をしないはずだと思います...

于 2015-02-09T14:03:16.590 に答える