Internet Explorer 9 & 10 CSS bug with overflow-y?
I ran into an interesting problem, maybe a bug, in Internet Explorer 10 (and IE9) today. Basically, if I had the following styles applied to the HTML tag, and then collapsed sections of the page with JavaScript, the height of the page would not collapse along with the content, ending up with significant white space left at the bottom of the document after collapsing large page sections. Removing either of the styles fixed the problem, but the combination didn’t work properly.
html {
height: 100%;
overflow-y: scroll;
}
I tried various combinations of styles to fix it, but in the end I had to remove the overflow-y style with JavaScript before expanding or collapsing content, and then reapplying it after the animation is complete. As the problem didn’t affect standard’s compliant non-IE browsers, I added a class during animation and only applied the style to remove the overflow-y property to IE9 and IE10.
Read more