Mengapa Jatuh Bawah Bootstrap Saya Muncul di Sebalik Elemen Lain dalam Internet Explorer 7?

Titis Turun Bootstrap Muncul di Sebalik Elemen Lain [Pendua]

Isu:

Dalam Bootstrap 2. .1, menu lungsur yang dibuat menggunakan kelas "menu lungsur" muncul di belakang teks dan elemen lain pada Internet Explorer 7 secara khusus, walaupun memberikan indeks z yang tinggi.

Diagnosis:

Masalahnya berpunca daripada isu konteks susun. Walaupun lungsur turun mempunyai indeks-z, ia hanya digunakan pada elemen dalam konteks tindanan yang sama. Dalam kes ini, elemen induk lungsur turun memerlukan indeks-z dan kedudukan yang jelas untuk mewujudkan konteks tindanan baharu.

Penyelesaian:

Ubah suai CSS seperti berikut :

<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: 1;
}</code>

Dengan menetapkan "z-index: 10000" dan "position: relative" pada ".header-top", konteks tindanan baharu dicipta. Menu lungsur turun dalam konteks ini kemudiannya diberikan "z-index: 1" untuk memastikan ia diletakkan di hadapan mana-mana kandungan lain dalam konteks itu. Ini menetapkan lapisan yang diingini dan menyelesaikan isu dalam Internet Explorer 7.

Atas ialah kandungan terperinci Mengapa Jatuh Bawah Bootstrap Saya Muncul di Sebalik Elemen Lain dalam Internet Explorer 7?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!