Souci avec z-index sous IE

Salut les Alsaciens ,

je viens vers vous, en espérant avoir une réponse ou une idée pour un petit souci avec les z-index sur IE6+7.

Alors , j'ai une liste ( ul ) , et dans chaque li j'ai des données + un picto au survol dessus j'affiche une info bulle , mais le problème c'est que quand il s'affiche , l'Item ( li ) qui suit s'affiche au deSSUS de cette info bulle, même si j'ai donnée un z-index à l'INFo bulle plus grand que les LI.



Merci d'avance

Bonjour,

Sans page en ligne ni bout de code, impossible de t'aider.

Désolé , j'ai pas de page en ligne, mais voilà je pense que c'est assez simple :
Voici un exemple de code :

<ul>
	<li>
		<div class="options-content">
			<p>
				Lorem ipsum dolor sit amet, coLorem ipsum dolor sit amet, coLorem ipsum dolor sit amet, co
			</p>
			<a href="popin.html">LIEN</a>
		</div>			
		<div class="help">
			<a href="#" class="options-help"></a>
			<div class="info-bulle">
				<div class="inner">
					Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
				</div>	
			</div>
		</div>		
	</li>
	
	<li>
		<div class="options-content">
			<p>
				Lorem ipsum dolor sit amet, coLorem ipsum dolor sit amet, coLorem ipsum dolor sit amet, co
			</p>
			<a href="popin.html">LIEN</a>
		</div>			
		<div class="help">
			<a href="#" class="options-help"></a>
			<div class="info-bulle">
				<div class="inner">
					Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
				</div>	
			</div>
		</div>		
	</li>

	<li>
		<div class="options-content">
			<p>
				Lorem ipsum dolor sit amet, coLorem ipsum dolor sit amet, coLorem ipsum dolor sit amet, co
			</p>
			<a href="popin.html">LIEN</a>
		</div>			
		<div class="help">
			<a href="#" class="options-help"></a>
			<div class="info-bulle">
				<div class="inner">
					Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
				</div>	
			</div>
		</div>		
	</li>
	
</ul>

Et voici la css :

ul li {
  margin-bottom:6px;
  position:relative;
}

ul li .options-content { 
  overflow:hidden;
  padding:0 0 6px 7px;
  position:relative;
  width:730px;
  z-index:1;
}

.help  { // div qui contient l'info bulle, est en absolute et un z-index de 5
  height:21px;
  position:absolute;
  right:1px;
  top:0;
  width:21px;
  z-index:5;
}

.help .info-bulle { // Info bulle en absolute , zindex de 5
  display:none;
  left:-155px;
  position:absolute;
  top:-34px;
  width:151px;
  z-index:5;
}

Alors, sur FF et ie8, y'a aucun problème mais sur IE7 + 6 , l'Info bulle s'affiche au dessous de LI qui suit.