文本溢出：省略号在 IE 上不起作用答案

【问题标题】：text-overflow:ellipsis doesn't work on IE文本溢出：省略号在 IE 上不起作用
【发布时间】：2013-02-02 16:56:53
【问题描述】：

在this 页面的左侧边栏中有一些链接被裁剪：

.widget-area .textwidget li {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

在 Firefox/Chrome 中正确显示：

不幸的是 Internet Explorer 8/9/10...：

问题不在于 IE 10 对 text-overflow:ellipsis 的支持。例如 this 也适用于 IE 10！我的实施有什么问题？我还尝试添加 -ms-text-overflow:ellipsis，但没有任何运气。

【问题讨论】：

【解决方案1】：

删除word-wrap: break-word 属性应该会有所帮助。

【讨论】：

【解决方案2】：

将 width 属性添加到您的 CSS 代码中。这会有所帮助..

【讨论】：

【解决方案3】：

对于 IE，您应该添加一些额外的代码..比如更改您的宽度属性..或尝试使用 dotdotdot jquery 插件..这将是一个替代解决方案.. 像这样

编辑：点此链接

告诉你为 IE 设置 width:100%..

【讨论】：

一个不错的解决方案是使用 jQuery 来处理这个小东西？呐。这应该是一个简单的修复，比如将 3 个 CSS 声明移动到容器中......类似的东西！我用谷歌搜索，但似乎找不到任何有趣的东西。
很好的解决方案，因为它的跨浏览器实现..以及良好的演示..最简单的解决方案并不总是最好的..
尝试在 jsfiddle.net/HerrSerker/kaJ3L/1/ 中运行它