Pourquoi mon menu contextuel apparaît-il derrière le bouton dans IE7 ?

Problème d'index Z IE7 pour le menu contextuel

Énoncé du problème :

Dans IE7, un menu contextuel (ul) apparaît sous le bouton auquel il est associé, masquant le menu. Ce comportement diffère des autres navigateurs en raison de la gestion unique des contextes d'empilement par le navigateur.

Analyse :

Le CSS utilisé pour le bouton et le menu positionne ces éléments en utilisant des valeurs relatives et positionnement absolu, respectivement. Cependant, dans IE7, l'ancêtre positionné le plus proche (dans ce cas, le div « contrôle-action ») détermine le contexte d'empilement. Cela signifie que le z-index (10000) du menu n'est pas pris en compte, et que le menu est positionné en dessous du bouton.

Solution :

Pour résoudre ce problème , l'ordre des éléments HTML peut être modifié comme tel :

<div class="control-action">
  <ul>

En plaçant le bouton après le ul, le bouton devient l'ancêtre positionné le plus proche, établissant un nouveau contexte d'empilement. Par conséquent, le z-index du menu (10000) devient effectif, et le menu apparaît désormais au dessus du bouton.

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!