Bonjour,
je rencontre un soucis avec les positionnements en absolute et IE7 et 6... je bataille depuis plusieurs heures a faire des modifs, chercher sur le net... bref, j'ai plus de cheveux
Le soucis doit être évident mais... je bloque
Je me permet donc de voir si l'un d'entre vous pourrait m’apporter un peu de lumière sur le problème.
Voici le html :
et la css : ( avec de la déco pour bien cerner le problème )
Le soucis :
les ul li sont en relatif afin de positionner le ul enfant en absolute
Sous IE7 et 6, le ul li ul positionné en absolute passe sous le second
ul li (en relatif )
J'ai ajouter un div sous la structure des listes, si je le positionne en relatif, il passe également sur les blocs en absolute
Bref, j'en perds mon basque
J'ai une url de test pour le rendu, si vous le souhaitez...
Merci
Modifié par jmi (12 Jul 2012 - 16:41)
je rencontre un soucis avec les positionnements en absolute et IE7 et 6... je bataille depuis plusieurs heures a faire des modifs, chercher sur le net... bref, j'ai plus de cheveux
Le soucis doit être évident mais... je bloque
Je me permet donc de voir si l'un d'entre vous pourrait m’apporter un peu de lumière sur le problème.
Voici le html :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
<head>
<title><?=$_title;?></title>
<link rel='stylesheet' type='text/css' href='test.css' />
</head>
<body>
<ul id='menu_famille'>
<li id='fampratique' class='listefamille'>
Totot
<div class="subMenu">
<ul style=''>
<li>toto1</li>
<li>toto1</li>
<li>toto1</li>
<li>toto1</li>
<li>toto1</li>
<li>toto1</li>
</ul>
</div>
</li>
<li id='fampratique1' class='listefamille'>
toto2
<div class="subMenu decale">
<ul style=''>
<li>toto2</li>
<li>toto2</li>
<li>toto2</li>
<li>toto2</li>
<li>toto2</li>
<li>toto2</li>
</ul>
</div>
</li>
</ul><!-- menu_famille -->
<div style='height:20px;background:#ccc;'>toto</div>
</body>
</html>
et la css : ( avec de la déco pour bien cerner le problème )
body,html{ position: relative;}
*{margin:0;padding:0;}
ul#menu_famille {
position: relative;
background:#666;
padding:10px;
}
ul#menu_famille li.listefamille{
position: relative;
padding:10px;
background:#ccc;
position: relative;
width:400px;
border:solid 2px #000;
}
div.subMenu{
}
ul#menu_famille li.listefamille div.subMenu ul{
position:absolute;
height:300px;
top:5px;
left:200px;
z-index:2;
width:250px;
background:green;
zoom:1;
border:solid 2px #000;
}
ul#menu_famille li.listefamille div.subMenu ul li{
border:solid 2px #000;
width:150px;
}
ul#menu_famille li.listefamille div.decale ul{
left:300px;
top:-20px;
background:red;
}
Le soucis :
les ul li sont en relatif afin de positionner le ul enfant en absolute
Sous IE7 et 6, le ul li ul positionné en absolute passe sous le second
ul li (en relatif )
J'ai ajouter un div sous la structure des listes, si je le positionne en relatif, il passe également sur les blocs en absolute
Bref, j'en perds mon basque
J'ai une url de test pour le rendu, si vous le souhaitez...
Merci
Modifié par jmi (12 Jul 2012 - 16:41)