menu déroulant vertical

bonjours
Depuis le temps que j'observe mon code j'arrive toujours pas à trouver l'erreur

j'ai 4 menus principaux chacun avec 2 sous menus
mes deux sous derniers menus restent ouverts et ne se ferment pas une fois la souris passée
pouvez SVP me dire si vous voyiez d'où vient le problème, déjà que j'ai mis des jousr juste pour avoir un menu déroulant que j'ai même pas finit coté design
merci d'avance

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml"><head>

   
       <title> Artsites egyptiens </title>
      <meta name="Description" content="Forum du film Egyptien" />
<meta name="keywords" content="cinéma, acteurs, film, Egypte" />
<meta name="Category" content="Cinéma/Culture/forum/Egypte/voyage" />
<meta name="Copyright" content="forum film" />
<meta name="Language" content="fr" />


<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

	      <link rel="stylesheet" media="screen" type="text/css" title="forum" href="design-c9.css">
  <meta name="google-site-verification" content="fNOs6sKS8oI4euqyqqVi3ph3zsPX5WB_Mf7qAhomDZ4" />
  
    <script type="text/javascript" src="functions.js"></script>
   </head>
   <body>
   
   <div id="en_tete">
   <!-- Ici on mettra la banni? --> 
<div id="banniere">

</div> 

</div> 
<div id="menuh">
			<ul id="menuh">
					<li class="bouton_gauche"><a href="index.php">Accueil</a></li>
					<li class="bouton_gauche"><a href="http://egyptefilm.fr/forum">Forum</a></li>
					<li class="bouton_gauche"><a href="partenaire.php">Partenaires</a></li>
					
					
				</ul>
	</div>
</div>
<td valign="top" class="row1">    
                  <span class="gen"> 
                        <center><!-- CONFIG: --><marquee behavior="scroll" onmouseover="this.stop();" onmouseout="this.start();" scrollAmount="3" scrollDelay="3" direction="left" height="50"> 
						<font color="red"><font size="x-large;
"><strong>Pour vos commentaires, observations ou suggéstions soumettez les au</strong> </font></font> <a href="http://egyptefilm.fr/forum"><font color="blue"><font size="x-large;
"><b> Forum </font></font></b></a>  


<br /></marquee> </center> 
                  </span> 
              </td> 

<body>


<div id="menu">
        <div class="menu" id="menu1" onmouseover="affiche(this)">
	        <a href="index.php">Les acteurs </a>
				<div class="sousmenu" id="sousmenu1" style="display:none" onmouseout="affiche(this)">
					<div><a href="anciensa .php">Les anciens</a></div>
					<div><a href="actuela">comtemporain</a></div>
				</div>
		</div>		
		
		<div class="menu" id="menu2" onmouseover="affiche(this)">						
			<a href="danceuse.php">Les danceuses  </a>
				<div class="sousmenu" id="sousmenu2" style="display:none" onmouseout="affiche(this)">
					<div><a href="anciensa .php">Les anciens</a></div>
					<div><a href="actuela">comtemporain</a></div>
				</div>
		</div>		
		
		<div class="menu" id="menu3" onmouseover="affiche(this)">
	        <a href="chanteurs.php">Les chanteurs </a>
				<div class="sousmenu" id="sousmenu3" style="display:none" onmouseout="affiche(this)">
					<div><a href="anciensa .php">Les anciens</a></div>
					<div><a href="actuela">comtemporain</a></div>
				</div>
		</div>		 
								
			<div class="menu" id="menu4" onmouseover="affiche(this)">
	        <a href="comique.php">Les comiques </a>
					<div class="sousmenu" id="sousmenu4" style="display:none" onmouseout="affiche(this)">
					   <div><a href="anciensco.php">Les anciens</a></div>
					   <div><a href="actuelco.php">comtemporains</a></div>
					</div>
			</div>		
		
		
					
		 
   
</div>

Le CSS

#menu{
	margin:20px 0 0 50px;
	background:#0f0;
	color:#fff;
	float:left;
	display:inline;
}
#menu div{
	width:120px;
	text-align:center;
}
.menu{
	position:relative;
}
#menu div a:link, #menu div a:visited, #menu div a:hover{
	color:#fff;
	font-family:arial,sans-serif;
	font-size:12px;
	text-decoration:none;
	padding-top:3px;
	height:22px;
	display:block;
}
#menu div a:link, #menu div a:visited{
	background:#404040;
}
#menu div a:hover, #menu div a:active, #menu div a:focus{
	background:#ca0003;
}
.sousmenu{
	position:absolute;
	left:120px;
	top:0;
}

C'est en recopiant :honte:

mais le problème ne vient pas de body, voilà j'ai mis la partie concerné par le menu

<div id="menu">

        <div class="menu" id="menu1" onmouseover="affiche(this)">
	        <a href="index.php">Les acteurs </a>
				<div class="sousmenu" id="sousmenu1" style="display:none" onmouseout="affiche(this)">
					<div><a href="anciensa .php">Les anciens</a></div>
					<div><a href="actuela">comtemporain</a></div>
				</div>
		</div>		
		
		<div class="menu" id="menu2" onmouseover="affiche(this)">						
			<a href="danceuse.php">Les danceuses  </a>
				<div class="sousmenu" id="sousmenu2" style="display:none" onmouseout="affiche(this)">
					<div><a href="anciensa .php">Les anciens</a></div>
					<div><a href="actuela">comtemporain</a></div>
				</div>
		</div>		
		
		<div class="menu" id="menu3" onmouseover="affiche(this)">
	        <a href="chanteurs.php">Les chanteurs </a>
				<div class="sousmenu" id="sousmenu3" style="display:none" onmouseout="affiche(this)">
					<div><a href="anciensa .php">Les anciens</a></div>
					<div><a href="actuela">comtemporain</a></div>
				</div>
		</div>		 
								
			<div class="menu" id="menu4" onmouseover="affiche(this)">
	        <a href="comique.php">Les comiques </a>
					<div class="sousmenu" id="sousmenu4" style="display:none" onmouseout="affiche(this)">
					   <div><a href="anciensco.php">Les anciens</a></div>
					   <div><a href="actuelco.php">comtemporains</a></div>
					</div>
			</div>		
		
		
					
		 
   
</div>

2 dernier sous-menu reste ouverts

menu déroulant vertical

Supprimer

Modérer

Signaler le message aux modérateurs