Intermittent margin collapse of last sibling element upon selecting text within preceding same-type sibling

This test case demonstrates the quirky behaviour of IE8 RTW where there is intermittent margin collapse of sibling element upon selecting text within preceding same-type sibling within same list-item.

Since this behaviour is intermittent, its very hard to diagnose exactly how or why it is occuring.

Steps to reproduce

Select and highlight the first five list-items below. Whilst still retaining that selection, very slowly select the list-item, 'AND NOW THIS...'. Although intermittent, you should be able to observe the margin collapsing (or at least a noticeable jump), between this last list-item and the latter portion of text highlighted in yellow.

Possible triggers

From my analysis, I've included that it's possible this bug can only be reproduced upon using a list (OL or UL) when the two DIV siblings (highlighted in yellow) are nested in one list-item.

Screenshot

Live Example

• SELECT
• AND
• HIGHLIGHT
• THIS
• TEXT
• AND NOW THIS BIT fhdfkljhdf sjfgdjklf dfbjdksfgdsjklf dbfjkdbfjdsfjdbfdsbfkds fnkjfbjkldsnfrnf senfr4nf49fn 4nf9ewhf
  The top margin applied to this DIV element will collapse, and this text will get shifted up fjdkejfr fsdasjdslfdlkfhdsfhdsfjklhdsfjkdshfkdsh fjdlkfldfl;dsfjerferfr