unnecessary scrollbar appears in IE

[Hellga]

The issue is related to IE scrollHeight issue described here:

http://stackoverflow.com/questions/22174841/scrollheight-is-incorrect-in-ie.

When the element has property - { overflow: auto or hidden; } - .scrollHeight of the element can be 1 or 2 px bigger than .innerHeight(). That causes unnecessary scrollbar appearance in IE. Cause the calculations here:

pct = paneHeight / this.scrollHeight

will result in a number bigger than 1.

[vedankita]

I am facing same problem with IE browser is there any solution to remove unnecessary scrollbar

[Hellga]

I haven't found any solution to get the correct value of scrollHeight. Therefore the only workaround for me was to decrease 'this.scrollHeight' value in the code, so that the code will be the following:

pct = paneHeight / (this.scrollHeight - 2) (in resize method)

Not a very good solution, but it works. Just one note: in some cases scrollHeight in IE is 2 px bigger than in Chrome, so I've decreased the value by 2.

[vedankita]

thanks 👍

[jstoudt]

@Hellga I've been looking into this for some time now, and I haven't found an acceptable solution to this problem.

Unfortunately, the only advice I can offer is to avoid styling components inside the enscroll pane which trigger IE's rounding error. For example, using points to specify font-size converts to a subpixel pixel size which can trigger the error.

I know this isn't always an acceptable solution, so I will keep thinging of something better.