5

これを詳細に説明するビデオへのリンクを含めましたが、基本的にFirefoxは要素に左/右の空白を追加して、認識されるパディングをChromeやIEとは異なるものにします。Firebugの値を変更して元に戻すと、空白がなくなり、最初に期待どおりに機能します。これは非常に苛立たしいことです、何かアイデアはありますか?

正確な説明については、ビデオをご覧ください。

ありがとう

アップデート1:これはコードを検査できるテストサーバーです。ビデオとは少し異なる場合がありますが、問題は同じです。test.audrey-oxenhorn.gotpantheon.com

更新2:FFに問題があるのは:first-letter疑似要素のようです。これは実際のブラウザのバグだと思いますが、現時点でこれを解決する方法がわかりません。

4

2 に答える 2

4

さて、私はこれを理解しました!

JSfiddleでこれを再現しようと試行錯誤した後、:first-letter疑似要素が問題の原因であることがわかりました。次に、検索を行ったところ、これは2007年から開いているFirefoxの既知のブラウザのバグであることがわかりました。ここにも同様の問題があります。Firebugを介してリフロー/再描画をトリガーすることで問題を修正できたので、問題は前述の問題と同じであると考え、次のコードを使用してそのブロック要素でリフローをトリガーしました。

@-moz-keyframes bugfix { from { padding-right: 1px ; } to { padding-right: 0; } }

.sf-menu a {
  -moz-animation: bugfix 0.001s;
}

問題は解決しました。Bugzillaレポートをこの質問にリンクしました。

于 2012-10-31T16:32:16.053 に答える
0

CSSマスターリセットを適用する必要がある場合があります。ここで見つけることができます:http://meyerweb.com/eric/tools/css/reset/

これをCSSドキュメントの先頭に適用します。または、親のCSS宣言を確認してください。継承に問題がある可能性があります。

お役に立てれば!

于 2012-10-31T14:31:47.447 に答える