CODEWITHSUNDEEP
htmlcsstwitter-bootstrapkendo-ui
janb
janb

Reputation: 370

text-overflow: ellipsis working on IE11 Win7 but not IE11 Win8, is this known behavior?

For the first time ever I had to use the text-overflow: ellipsis property (ASP. MVC 4 application using Bootstrap and Kendo). It all worked as expected, except when I looked at the page on a Win 8.1 machine running IE11, where the long text is not cut off at all and thus the layout gets broken. The thing is, when I look at the same page on IE11 (same version) on my development machine (Win 7), it works flawlessly. It also works just fine in Chrome and Firefox.

I tried setting and removing other properties (white-space: nowrap, overflow: hidden, ms-text-overflow, width, display: block) to no avail, nothing changes this discrepancy. I tested the Win 8 behavior on two machines, both exhibit this. Is this a known bug? Are the IE11 versions for Win7/8 really different? If not, what could be causing this? The only thing different other than Win8 is that the Win 8 machines called the site remotely, it was running locally on the Win 7 machine.

Upvotes: 0

Views: 4471

Answers (1)

Jens Fiederer
Jens Fiederer

Reputation: 379

For a simple sample to work with, try

http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_js_text-overflow

In Chrome, using the text-overflow:ellipsis makes all 4 lines end in ellipses.

In IE11 (under Windows8.1), only the very first line gets an ellipsis.

A comment at text-overflow:ellipsis doesn't work on IE states that "Note: IE11 (and probably below) will not work with this if there are <br> in front of the text! "

Upvotes: 1

Related Questions