firefox - フロートされたdivを新しい行に送信するSafari、chromeとIEは問題ありません

Question

状況：

親div: 300px

子 1: 幅 50 ピクセル、境界線 5 ピクセル

子 2: 幅 232px、余白 8px

chrome と IE では正常に動作しますが、Safari と Firefox では 2 番目の行が新しい行にドロップされます。これには何か理由がありますか？7px の左余白があるように、全体から 1 px を削除すると、それらは所定の位置に収まります。また、測定値はfirebugで完全に一致するため、2つが同じ行に収まらない理由がわかりません。

Answer 1

親 div と子から他のすべてのパディングまたはマージンを削除してみてください。これらは、デフォルトのブラウザ スタイルが原因です。(または CSS Reset を使用して、すべての要素に対してこれを行います)

また、注として、Safari と Opera は、10 進数がある場合の測定値について少し嘘をついています。それらは切り上げまたは切り捨てであり、Firefox や Chrome のように正確ではありません。