Firefox：100％和內部填充？

Question

我有一個寬度爲100％的div和裏面的段落。該div有填充1.1em。在Chrome上，evrything按預期工作 - div跨越父級空間的100％，並且由於填充，段落會受到一點擠壓。

但是在Firefox的div上花費100％+填充。如何在Firefox上強制內部填充？

Answer 1

如何在Firefox上強制內部填充？

的要素使用box-sizing: border-box;，作爲默認，paddingborder和margin被計數的元件的外部。

使用box-sizing: border-box;將改變框模型，這將使​​padding和border在元素內而不是外部計數。

Demo沒有box-sizing

Demo隨着box-sizing

看到區別？您將不會在第二個演示中獲得水平滾動條，其中border-box值爲box-sizing屬性。