Scroll With != Offset Width when no Ellipsis

Question

I am trying to figure out whether an element has ellipsis. I am using this stackoverflow answer.

When I test on IE the scrollWidth is always greater than offsetWidth. Even if there are no ellipsis, the scrollWidth is 1px greater than the offsetWidth. Works fine of Chrome, as expected.

Please check this example. This will give you different values on IE and Chrome.

Is this happening due to a bug in IE? Is it a known issue? And is there a work around?

Since scrollWidth in IE is the same as in Chrome, I would say the offsetWidth is 1px smaller than the scrollWidth. Details, Shmetails. — GolezTrol
– GolezTrol, Commented Dec 29, 2014 at 16:26
Looks like float: left; is the cause. An article about offsetWidth in IE that might be useful. — MiKo
– MiKo, Commented Dec 29, 2014 at 16:47
@0x2D9A3 The article helped. IE seems to be rounding up scrollWidth and rounding down offsetWidth. I am able to get the actual width (float val) using getComputedStyle, but can't find the actual scrollWidth. — Zuhaib
– Zuhaib, Commented Dec 29, 2014 at 19:34
Workaround answer in this question: stackoverflow.com/questions/30900154/… — Chris Janssen
– Chris Janssen, Commented Oct 10, 2019 at 19:29

Rupert · Accepted Answer · 2014-12-29 16:36:06Z

0

Do you mean a an actual text ellipsis or a css one?

If text it may be better to parse the element's text for three dots at the end. Something like this:

function hasEllipsis(text){ var regex = /\.\.\.$/; return regex.test(text); }

answered Dec 29, 2014 at 16:36

Rupert

1,63912 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

MiKo Over a year ago

It is clearly stated that this is a question about the text-overflow-property ellipsis… (And by the way, this comment has an ellipsis that your regexp won't match)

Zuhaib Over a year ago

It's the css ellipsis (text-overflow)

Collectives™ on Stack Overflow

Scroll With != Offset Width when no Ellipsis

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related