Chrome と Firefox でレンダリングされるテキストコンテナの幅サイズが異なる

Question

Chrome と Firefox でコンテナの幅が異なるサイズで表示されるのはなぜですか? 画像サンプル。 Chrome: レンダリング幅は 681.273

です

FireFox: レンダリング幅は 685.8499 です

リーリーリーリー

両方のブラウザで次のリンクを開くと、違いがわかります。

これは jsfiddle です

両方のブラウザで同じ幅でレンダリングする方法はありますか?

P粉649990163 · Answer

問題の原因:

異なるデフォルトスタイル: Chrome と Firefox には、HTML 要素に対して独自の異なるデフォルトスタイルがあります。
2 つのブラウザーの css 処理方法には違いがあります: どちらも独自のレンダリングエンジンを備えているため、css プロパティの処理方法が異なる場合があります。

css の使用 reset: css リセットは、ブラウザのデフォルトスタイルを削除するスタイルのセットです (css リセットとは )。
CSS ベンダープレフィックスを使用する : これらは、CSS プロパティがこのブラウザーをサポートするようにするために使用される CSS プロパティのプレフィックスです。CSS ベンダープレフィックス