Warum erscheinen Bootstrap-Dropdowns hinter anderen Inhalten in IE7?

Bootstrap-Dropdowns tauchen hinter anderen Inhalten auf

Frage:

Bootstrap-Dropdowns erscheinen ständig hinter anderen Seitenelemente, insbesondere in IE7. Trotz der Anwendung von Z-Index auf das entsprechende CSS besteht das Problem weiterhin.

Antwort:

Dieses Verhalten ist auf ein Stapelkontextproblem zurückzuführen. Obwohl sich der Z-Index auf Elemente im selben Stapelkontext auswirkt, muss das Dropdown-Menü in einem Container mit Z-Index- und Positionseigenschaften platziert werden.

Lösung:

Ändern das CSS für das Header-Top-Div wie folgt:

<code class="css">.header-top {
  z-index: 10000;
  position: relative;
}

.header .header-nav ul#nav-account ul.dropdown-menu,
.header .header-nav ul#nav-library ul.dropdown-menu {
  z-index: 10000;
}</code>

Durch Festlegen des Z-Index und der Position für das Header-Top-Div erstellen Sie einen neuen Stapelkontext, in dem sich das Dropdown befindet, und stellen so sicher, dass es immer vorhanden ist erscheint vor dem Seiteninhalt.

Das obige ist der detaillierte Inhalt vonWarum erscheinen Bootstrap-Dropdowns hinter anderen Inhalten in IE7?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!