TextRange offsetLeft y offsetTop roto en el modo de estándares de Internet Explorer 8 (IE8)

Parece que he encontrado un problema con Internet Explorer 8, al encontrar la posición de un rango de texto, por ejemplo, el texto seleccionado actualmente. No he podido encontrar ningún informe de este problema en StackOverflow ni en ningún otro lugar.

TextRange.offsetLeft y TextRange.offsetTop informan la esquina superior e izquierda del rango, y en todos los casos que he visto en IE8, son aproximadamente correctos,excepto en el caso cuando el rango está dentro de un IFrame. Cuando el rango está dentro de un IFrame, los valores de offsetLeft y offsetTop se desplazan en una cantidad negativa en relación con la posición del IFrame dentro de su padre. (Ver ejemplo abajo)

Este problema aparece solo cuando:

El navegador es IE8La página está en modo estándar.

Este problema haceno aparece cuando:

El navegador es IE7 o IE10.La página está en modo de peculiaridades.

Mis preguntas:

¿Pueden otros confirmar este asunto o estoy loco?¿Es este un problema conocido?¿Hay alguna solución sensata o trabajo alrededor? (Una solución sensata sería aquella en la que el JS en el marco no necesita saber nada sobre su ventana principal)

Gracias.

Un ejemplo del problema: (Vea la diferencia en IE8 frente a IE9)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
        <title>IE8 IFrame Text Range Position Test Page</title>
        <style type="text/css">
            body {
                font-family: Tahoma;
            }
            #target {
                background-color: #CCC;
                position: absolute;
                left: 50px;
                top: 50px;
            }

            #bullsEye {
                position: absolute;
                background-color: red;
                width: 5px;
                height: 5px;
            }

            iframe {
                margin: 10px 75px;
            }
        </style>
        <script type="text/javascript" charset="utf-8">
            function target() {
                var range = document.body.createTextRange();
                range.moveToElementText(document.getElementById('target'));
                range.select();
                var bullsEye = document.createElement('div');
                bullsEye.id = 'bullsEye';
                bullsEye.style.left = range.offsetLeft + 'px';
                bullsEye.style.top = range.offsetTop + 'px';
                document.body.appendChild(bullsEye);
                document.getElementById('output').innerHTML = 'range.offsetLeft = ' + range.offsetLeft + ', range.offsetTop = ' + range.offsetTop;
            }
        </script>
    </head>
    <body>
        <div id="target">Target</div>
        <input type="button" value="Hit Target" onclick="target();"> <span id="output"></span>
        <br><br><br><br><br>
        <script>
            if (window.parent == window) document.write('<iframe src="?tfr" height="150" width="500"></iframe>');
        </script>
    </body>
</html>

Respuestas a la pregunta(3)

Su respuesta a la pregunta