Css 如何在Firefox和Chrome中显示相同的填充？

我有一个文本框。背景为黑色，文本为白色。它在Chrome和Safari中可以正确显示，但由于某些原因，在Firefox中显示效果很差。为了证明这一点，我认为Firefox是正确的，而不是Chrome或Safari——我现在只支持大多数人

以下是HTML：

<div class="col-sm-6 black">
  <p style="text-align:center">Each unit is full of character and convenience with original hardwood floors, 10&rsquo; ceilings, washer/dryer and walkability to local restaurants and shops.&nbsp;</p>
  <p style="text-align:center">Rents range from $825 &ndash; $950/month.</p>
  <p style="text-align:center">Call us to reserve your unit:&nbsp;</p>
  <p class="estilo big" style="text-align:center">919-292-2200</p>
  <p class="estilo" style="text-align:center">or through Facebook messenger.<br />
  facebook.com/thelutterloh</p>
</div>

这是它在Chrome和Safari中的外观：

这是相同代码在Firefox中的呈现方式：

我已经广泛地寻找解决方案，但没有看到任何解决方案。此外，Mozilla没有可应用的特定于-moz的样式

---

如果有任何帮助，我们将不胜感激。

字体大小的不一致性似乎导致firefox中

.black

div的高度增加（因为字体大小似乎更大）。在上面添加的填充会增加div的总高度。 我建议在进行任何样式设置之前使用或CSS重置，以避免出现此类情况

---

另一个解决方法是设置

框大小：边框框

，并在

.black

分区上设置

最大高度

，以及

溢出：隐藏

您还可以使用@font-face，这将有助于在浏览器之间保持字体一致，而不是使用默认值

谢谢@Rocks，最大高度设置成功了。非常感谢。

.black { background-color: #000; padding: 15px 15px 65px 15px; }