28172 sujets

CSS et mise en forme, CSS3

Probleme avec image de menu sous ie 6

Bonjour,

je rencontre un probleme avec ie 6.
J'ai un menu CSS dans lequel des images sont appelées :menu_haut, menu_droite et menu_bas.
pour menu_heut et droite : aucun probleme
par contre, le menu_bas n'apparait pas sous ie. sauf lorsque la derniere section du menu est déroulé.
je n'y comprend plus rien.
voila mon code php : 

<!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" xml:lang="en">
<?php
	//On inclu le fichier de fonctions de connexion à la base
	include "fonctions/php/acces_bdd.php";
 
	//connexion à la base de donnees
	connecter("test_menu");
?>
<head>
  <title>Intranet V 2.0</title>
	<link rel="stylesheet" href="css/style.css" type="text/css" />	
	<link rel="stylesheet" href="css/style_menu.css" type="text/css" />
	
	<script type="text/javascript">
		<!--
		window.onload=montre;
		function montre(id) {	
			var d = document.getElementById(id);
				//Ne pas oublier de modifier le nombre de menu principaux
				for (var i = 1; i<=11; i++) {
					if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
				}
			if (d) {d.style.display='block';}
		}
		//-->
	</script>
</head>
<body>
	<div id="ombre">
	  <div id="global" class="bloc_central">
			<div id="header">
				<!--<embed width="250" height="150" align="middle" type="application/x-shockwave-flash" salign="" allowscriptaccess="sameDomain" allowfullscreen="false" menu="true" name="anim_header" bgcolor="#ffffff" devicefont="false" wmode="transparent" scale="showall" loop="true" play="true" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" src="flash/anim_header.swf"/>-->
			</div>
			<dl id="menu">				
				<?php
				// creation et envoi de la requete
				$query = "SELECT * FROM menu WHERE niveau = 1 ORDER BY ordre";
				$result = mysql_query($query);

				//Recuperation du nombre de resultat de la requete
				$nb = mysql_numrows($result);

				// Recuperation des resultats
				$cpt = 1;
				while($row = mysql_fetch_row($result)){			
					$query2 = "SELECT * FROM menu WHERE niveau = 2 and pere = ".$row['0']." ORDER BY ordre";
					$result2 = mysql_query($query2);

					if (@mysql_num_rows($result2)>0) {
						if ($cpt == 1){echo "<img src='images/menu_haut.gif' alt='menu_haut' border='0'/>";}
						echo "<dt onclick=\"javascript:montre('smenu".$cpt."');\"><a href='#'><span class='dt_texte'>$row[1]</span></a></dt>";
						echo "<dd id='smenu".$cpt."'><ul>";
						while($row2 = mysql_fetch_row($result2)){
							echo"<li><a href='#'><span class='li_texte'>$row2[1]</span></a></li>";
						}
						echo "</ul></dd>";
					}else{
						if ($cpt == 1){echo "<img src='images/menu_haut.gif' alt='menu_haut' border='0'/>";}
						echo "<dt onclick='javascript:montre();'><a href='#'><span class='dt_texte'>$row[1]</span></a></dt>";
					}
					$cpt++;
				}
				?>
				<img src='images/menu_bas.gif' alt='menu_bas' border='0'/>
			</dl>
		</div>	  
	</div>	    
</body>
<?php
	//deconnexion à la base de donnees
	deconnecter();
?>
</html>


et voila la CSS de mon menu : 

dl, dt, dd, ul, li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#menu {
	position: absolute; /* placement du menu, à modifier selon vos besoins */
	top: 13%;
	left: 0;
	width: 10em;
}

#menu dt {
	cursor: pointer;
	margin: 0px 0;
	line-height: 19px;
	text-align: left;
	font-weight: bold;
	font-size: 11px;
	background: url(../images/menu_droite.jpg) no-repeat  right #556e83;
	border-left: 1px solid #000000;
	/*border-bottom: 1px solid #D1DBBD;*/
}

.dt_texte{
	margin-left: 20px;
}

#menu dd {
}

#menu ul {
}

#menu li {
	text-align: left;
	font-size: 11px;
	line-height: 15px;
	border-left: 1px solid #000000;
	background: url(../images/menu_droite_blanc.jpg) no-repeat  right #FCFFF5;
}

.li_texte{
	margin-left: 30px;
}

#menu dt a {
	color: #ffffff;
	text-decoration: none;
	display: block;
	border: 0 none;
	height: 100%;
}

#menu li a {
	color: #000000;
	text-decoration: none;
	display: block;
	border: 0 none;
	height: 100%;
}

#menu li a:hover {
	color: #556e83;
	font-weight: bold;
}

#menu dt a:hover{
	background: url(../images/menu_droite_orange.jpg) no-repeat  right #f97a0a;
}


je compte vraiment sur vous car après des heures de galères, je ne m'en sort plus
merci d'avance
Sujet clos
Aller à