Pourquoi les listes déroulantes Bootstrap apparaissent-elles derrière d'autres contenus dans IE7 ?

Les listes déroulantes Bootstrap émergent derrière d'autres contenus

Question :

Les listes déroulantes Bootstrap apparaissent constamment derrière d'autres éléments de page, en particulier dans IE7. Malgré l'application de z-index au CSS concerné, le problème persiste.

Réponse :

Ce comportement provient d'un problème de contexte d'empilement. Bien que z-index affecte les éléments dans le même contexte d'empilement, la liste déroulante doit être placée dans un conteneur avec à la fois les propriétés z-index et position.

Solution :

Modifier le CSS pour le div en-tête comme suit :

<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>

En définissant z-index et la position pour le div en-tête, vous établissez un nouveau contexte d'empilement dans lequel réside la liste déroulante, en vous assurant qu'elle est toujours apparaît devant le contenu de la page.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!