如何使输入元素文本溢出：IE上的省略号？

I found my

我发现了我的

fiddle only work on Chrome and FF, I don't know why it don't have the ellipsis effect on IE? Hope someone can help on this, it would be better if you can solve it by a CSS way.

小提琴只适用于Chrome和FF，我不知道为什么它没有IE上的省略号效果？希望有人可以提供帮助，如果你能用CSS方式解决它会更好。

BTW, It seems the div has text-overflow:ellipsis effect on both IE and Chrome.

顺便说一句，似乎div有文本溢出：省略号和IE浏览器的省略号效果。

css:

CSS：

.ellip {
  white-space: nowrap;
  width: 200px;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
}

html:

HTML：

<input type="text" class="ellip" value="abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz">
<div class="ellip">abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz</div>

2 个解决方案

#1

.ellip:before {
content: ''; /* IE9 ellipsis fix */
}

Example: https://jsfiddle.net/svdbco/s1x0qx1a/

示例：https：//jsfiddle.net/svdbco/s1x0qx1a/

IE8 screenshot:

IE8截图：

IE11 screenshot:

IE11截图：

#2

what effect you expect to see???

你期望看到什么影响???

use this and see effect:

使用此功能并查看效果：

.ellip {
    white-space: nowrap;
    width: 200px;
    overflow: hidden;
    -o-text-overflow: clip;
    -ms-text-overflow: clip;
    text-overflow: clip;
 }