Internet explorer 文本溢出的呈现问题：IE9中的省略号

文本溢出：省略号在所有支持项目的浏览器中都能正常工作，但在IE9中仍然存在渲染问题（请参见屏幕截图）。 遵循CSS规则，但省略号的字符没有正确呈现。 大多数（或全部）关于文本溢出的帖子：省略号通常是关于它的实现，但关于这个主题，我没有运气

---

我在这里找到了关于这个问题的更多信息：

这是一个浏览器问题。上面的链接还指向一个复制该问题并提出解决方案的链接（不幸的是，它无法在我正在进行的项目中实现）

解决方案的HTML：

<div class="btn btn-primary btn-large"
     style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 300px;">
    <span class="ie9-sucks">&nbsp;</span>
    <i class="icon-download-alt"></i>
    ALongTextBeinEllipsed AndATextAfter
</div>

---

昨天我也有同样的问题。 在ie9中，文本溢出：省略号可能受其第一个子元素的影响，例如：

<div class="text-ellipsis" style="width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">
  <span class="icon"></span>
  <span class="text"> here long text</span>
</div>

这里是长文本

如果为第一个跨距（我指的是字体系列）设置css ICont，它会影响后面的文本

在ie8+中

    <div class="text-ellipsis" style="width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">
      <span class="first-text">first</span>
      <span class="icon"></span>
      <span class="text"> here long text</span>
    </div>

第一
这里是长文本

---

第一个文本的字体大小会影响文本省略号的大小。

设置“宽度、空白和溢出”属性不会失败。请看屏幕截图，这不是实现它的方式（它可以工作），而是符号的呈现方式。只需将这些溢出样式移到文本，就可以解决问题：这里是长文本

    <div class="text-ellipsis" style="width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">
      <span class="first-text">first</span>
      <span class="icon"></span>
      <span class="text"> here long text</span>
    </div>