element.scrollHeight returning incorrect value in IE11

thanks in advance for any advice or tips on this one.

So I’ve built my own animated dropdown reveal javascript module. And using scrollHeight detecting the hidden dropdown’s content height, storing it as a data attribute and then animating to that value on click. It works quite seamlessly across browsers (I know paddings/margins can be an issue), however in IE11 I’m getting a wildly incorrect value.

A copy of my component/code is over on CodePen – codepen.io/rhyspacker/pen/PozRjKx

The issue: in chrome/modern browsers, my dropdown element data attribute is say 712 (scrollHeight) and in IE11 I get a value that is quite incorrect at 6933.

Also here’s a staging url that shows the full page with dropdowns on – https://clymac.m360.co.uk/system-partners. Could it be other aspects of my website causing this bug?


Source: Ask Javascript Questions