IE8 RC1 Bug Test - vertical scrollbar when using overflow:auto, and certain combinations of EM units for line-height and font-size for descendant elements

Although the greyed-out vertical scrollbar that this bug produces is unlikely to effect page layout itself, it's a real eye sore. I deem this bug to be of high importance since there's a common occurence of authors using overflow:auto to clear a float container.

This is a spurious bug that appears when using only certain combinations of EM units for line-height and font-size for descendant elements of the element that has overflow:auto applied to it. There seems to be no pattern to which value combinations trigger the bug

In the example below, if you're using IE8 RC1 (and possibly Beta 2) you'll notice a greyed-out vertical scrollbar in the yelow box. In terms of markup I have used the following:-

.post span{
        line-height:8em;
}

.post span{
        font-size:2em; 
}

.post{
        font-size:0.99em; /* Must be smaller than 1em - although only reproducible when using spurious unit values */
        overflow:auto;
}

This particular bug is triggered when a certain combination of EM unit values is established between a parent (DIV.post), and it's descendant (SPAN) with regards to line-height and font-size.

Text