DieseGeige erzeugt erwartete Ergebnisse in echten Browsern (ich habe FF, GC, Safari ausprobiert), bricht jedoch unerwartet in IE9, IE10 und IE11 ab. Keine Probleme mit IE7 oder IE8.

<div class="root">
    Top
    <div class="footer">Bottom</div>
</div>

.root {
    background-color: red;
    position: absolute;
    height: auto;
    bottom: 0; top: 0; left: 0; right: 0;
    margin: 25px;
    border: 0;
    border-radius: 7px;
    overflow: hidden;
}

.footer {
    background-color: green;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100px;
}

Wenn ich entferneborder-radius oderoverflow:hidden von den Eltern funktioniert alles gut. Aber was um alles in der Welt hat es mit Kind mit fester Position zu tun? Es soll immer relativ zum Ansichtsfenster positioniert werden.

Ist es ein bekannter \ dokumentierter Fehler? Was ist das Grundprinzip dahinter?