Dieses Problem bestand in alle Versionen des Internet Explorers und wurde erst mit Version 8 behoben. Trotzdem surfen immer noch mehr als genug Benutzer mit älteren Versionen durchs Netz.
Als Web-Entwickler ist man stets bemüht, dass alle Seite in allen Browsern gut aussehen, weswegen man leider einen Workaround für diesen Bug benötigt.
Im Netz kursieren diverse Ansätze, die das Problem lösen. Die meisten davon, zeigen wie man in den CSS-Stylesheets die Attribute setzen muss, um eine bestimmte Ausprägung des Bugs in den Griff zu bekommen. Das Problem, das alle CSS-basierten Ansätze gemein haben ist, dass sie nie das Problem an der Wurzel lösen, sondern nur im aktuellen Code.
Eine weitere Möglichkeit die z-Index-Reihenfolge korrekt angezeigt zu bekommen, die noch dazu für die meisten Auswirkungen des Bugs beseitigt, ist eine Lösung via Javascript, die bei jedem Laden des Dokuments den z-Index korrekt berechnet. Bedient man sich der Bibliothek
jQuery muss man lediglich folgenden Code in den Header seiner Seiten einhängen und der z-Index-Bug ist umgangen.
<script type="text/javascript">
$(function () {
var zIndexNumber = 1000;
$('div').each(function () {
$(this).css('zIndex', zIndexNumber);
zIndexNumber -= 10;
});
});
</script>
Ergebnis des Scripts ist, dass man ohne weitere Anpassungen den Bug in den meisten Fällen umgangen hat.
Ist doch cool, oder?