3

私のページには 3 つの主要な要素があります。2 つのスパンと入力フィールド。

3 つの要素はすべて同じパディングと font-size を持っていますが、入力フィールドは 2 つのスパンよりも 1 ピクセル高くなっています (Firefox の場合)。Chrome では問題なく表示されます。

この「バグ」は、私が Google Web Fonts を使用していることが原因である可能性がありますが、問題についてどう思うか知りたいです。

ここにフィドルがあります Chrome と Firefox で開いて比較してください!

私はもう試した：

vertical-align: top; (middle, and bottom)
max-height: 50px;
line-height:;
overflow: hidden;

また、入力フィールドのフォントサイズを変更しようとしましたが、Firefox で問題が修正され、Chrome で問題が発生しました... 終わりがありません!

4

4 に答える 4

4

おそらく、高さを計算するためにパディングとフォントサイズに依存するのではなく、要素に固定の高さを使用する必要があります: http://jsfiddle.net/sN7aH/

#amount {
    font-size: 18px;
    background-color: #fcfcfd;
    font-family:'Montserrat', sans-serif;
    color: #bbc2cb;
    float: left;
    width: 312px;
    height: 50px;
}

ffとchromeでそれを使用しても違いはありません

于 2013-07-15T03:03:04.940 に答える
2 
.enter-price {
    max-height: 50px;
}

許可された高さを強制する必要がありました。問題が解決しました。

于 2013-07-15T03:03:16.277 に答える
0

最新の Firefox バージョンで変更がありました。Internet Explorer 11 と同じパディングを使用するようになりました。おそらくバグであり、現在は修正されています。しかし、変更ログにバグ修正が見つかりません。

しかし、Firefox 26 (更新前の最後のバージョン) では左右のパディングがなく、Firefox 29 (IE11 のように) では両側にデフォルトの 1px があったことから、動作は明らかに変わりました。

誰かがこれの変更ログへのリンクを指摘できますか? ありがとうございました！

于 2014-05-06T13:03:15.483 に答える