我正在使用此CSS设置div的样式：

下图显示了Safari和Chrome之间的区别：

我不知道为什么会如此不同。 字体在Chrome中看起来像"字体"，但是每个字符在Safari中的长度都稍长一些，这意味着每行平均只保留较少的字符。 由于div框的大小是固定长度，因此结果是文本的结尾距离底部边框太近。

我不能有可变长度的盒子。 您可以在此处查看该网站(转到"指导"部分)： 在此处输入链接说明

是否有解决此问题的简便方法？ 我知道每种浏览器的字体引擎都不同...

Safari的开放式Sans字体比chrome字体大，因此您需要为Safari浏览器使用开放式Sans Google Web字体渲染字体粗细

我认为这是因为浏览器的大小并不适合所有浏览器，并且您已经按照像素定义了CSS。请尝试将pixel(px)转换为percent(％)或em / rem值。

我希望这有帮助。

原因是，虽然其他浏览器以指定的确切大小显示字体，但Safari却以一系列的大小变化进行渲染。

我认为关键是，以10.3px呈现的字体比以10.0px呈现的字体更好。 (这些都是由价值构成的，但您明白了)。

结果是您在Safari和其他浏览器之间可以获得不同的结果。

实际操作中最简单的方法是将字体大小定义为百分比，然后慢慢调整窗口大小：

Ozake.com上的测试页

在其他浏览器中，字体将随窗口平滑调整大小。在Safari中，字体大小将保持不变，然后跳至新的大小，然后保持不变，依此类推。

我正在寻找一种解决方法(帮助，有人！)，因为这种行为使我的布局更加混乱，并使其看起来像在Ozake.com上存在拼写错误。