Html Internet Explorer 11中未正确呈现自定义字体宽度

在我们的一个网站上，我们使用typotheque.com中的字体，导入方式如下：

@import url( "http://fonts.typotheque.com/WF-XXXXX-XXXXX.css" );

字体在Chrome等浏览器上正确显示。在Windows 7上的Internet Explorer 11中，会呈现字体，但其宽度不正确。似乎文本的宽度是在应用字体之前呈现的

---

因此，文本会重叠，且单词的包装不准确：

---

在Chrome上，计算字体宽度并正确包装文字：

---

我们尝试过的其他事情：

• 我们是按照这里的指示来做的
• 我们确保在javascript文件之前链接css文件

我们非常感谢为解决这一问题而向正确方向提供的任何提示或推动。您可以在此处找到网站：

编辑：

• 新增

  分词：全部分词：无更改

• 删除了所有的字体可怕的东西：没有改变

---

当你将FireFox中的计算结果与IE中的计算结果进行比较时，你可以看到这里的坏男孩是什么

在IE中，h2的填充底部属性为4px。 当我取消选中此属性时，它对我来说很好

---

由于愚蠢的声誉限制，我无法在这里上传图片，但我希望我描述得足够好…

我也有打字错误webfont+IE问题。我现在的解决方法有点脏：我使用jquery$（window）.load按1px调整元素填充，然后IE正确地重新绘制字体。

是否使用规则-单词break:keep all；是的，没什么变化我看了一下你的样式表，在你加载页面样式之前，你加载了一堆字体很棒的东西。试着改变一下顺序。把你自己的页面样式放在第一位，特别是应用你的字体的样式。删除了字体很棒的东西，但没有任何效果，规则是：保留全部；我也可以取消选中文本装饰属性，然后它看起来不错。这（我猜想）是由于IE正在重新渲染元素。更改CSS中填充底部的值不会改变任何东西。但事实上，您的CSS在每个浏览器中都不相同，可能会有更多的差异。我会比较所有的道具，并尝试和错误，直到你找到正确的一个。