CSS z-index brisé dans IE7

Question

Je suis conscient du problème de z-index dans IE7, mais j'ai une situation étrange ici, et aucune des solutions suggérées en ligne ne semble fonctionner. J'ai une liste d'éléments, chacun a une div bulle pop-up dans la balise "li", comme ceci:

<div class="inner"> 
    <ul> 
    <li onmouseover="bubbleOn(5661)" onmouseout="bubbleOff(5661)" id="c5661"> 
     <img src="/images/new/simple-dot-brown.gif" class="coloredDot" /> 
     Asthma, 
     <small id="year5661">1974</small> 
     <div class="mouseover-bubble orange" id="bubble_5661" style="display:none;"> 
     <h6>Asthma</h6> 
     <div class="definition">        
      <p>A form of bronchial disorder....</p> 
     </div> 
     </div> 
    </li> 
    </ul> 
</div> 

Voici le CSS pertinent:

div.mouseover-bubble { 
    position: absolute; 
    width: 360px; 
    left: 10px; 
    bottom: 10px; 
    z-index: 10000; 
} 

Tant Comme je laisse le CSS comme je l'ai reçu, le pop-up fonctionne très bien. Mais on m'a demandé de déplacer les divs pop ci-dessous le "li" correspondant, au lieu de dessus. Si je change la ligne "bottom: 10px" en "top: 10px", alors soudainement dans IE7 l'index z échoue et je peux voir les informations qui devraient être cachées sous la div pop-up. Quelqu'un a des idées pour lesquelles cela se produirait? La plupart des choses sur l'index z de IE7 que je trouve parle de positionnement, mais je ne change pas le positionnement CSS, juste en changeant "bottom" à "top".

Answer 1

i eu le même problème ... ce moorning vous devez mettre l'élément dans position:relative

Une autre façon de le faire est de définir z-index du parent à quelque chose de plus ...

ne me demandez pas pourquoi ... mais il fonctionne

EDIT désolé .. Je viens de voir que vous ne pouvez pas changer la position de parent .. essayez la seconde option et laissez-moi savoir ce qui fonctionne