Problème de menu déroulant

Bonjour,

Je suis à la recherche d'une personne très sympa pour me donner un conseil sur la mise en place d'un menu déroulant.. il ne se met pas sur la ligne mais tout en dessous...
Ci-joint mon script
<ul>
<li>
<a href="#">Accueil</a>
<ul>
<li><a href="#">Historique</a></li>
<li><a href="#">Planning</a></li>
<li><a href="#">Réunion</a></li>
</ul>
</li>
<li>
<a href="#">Le métier</a>
<ul>
<li><a href="#">Disponibilité</a></li>
<li><a href="#">Liste</a></li>
</ul>
</li>
<li>
<a href="#">Les activités</a>
<ul>
<li><a href="#">Activités manuelles</a></li>
<li><a href="#">Spectacles</a></li>
<li><a href="#">Fête de Noël</a></li>
<li><a href="#">Carnaval</a></li>
<li><a href="#">Sortie fin d'année</a></li>
<li><a href="#">Promenades</a></li>
</ul>
</li>
<li>
<a href="#">Aides</a>
<ul>
<li><a href="#">Liens utiles pour l'emploi d'une Assmat</a></li>
<li><a href="#">Album photos</a></li>
<li><a href="#">Contact</a></li>
</ul>
</li>
</ul>
<ul id="menuDeroulant">
<li>
<a href="#">Accueil</a>
<ul class="sousMenu">
<li><a href="#">Historique</a></li>
<li><a href="#">Planning</a></li>
<li><a href="#">Réunion</a></li>
</ul>
</li>
<li>
<a href="#">Le métier</a>
<ul class="sousMenu">
<li><a href="#">Disponibilité</a></li>
<li><a href="#">Liste</a></li>
</ul>




<a href="#">Les activités</a>
<ul class="sousMenu">
</li> <li><a href="#">Activités manuelles</a></li> <li><a href="#">Motricité</a></li>
<li><a href="#">Spectacles</a></li>
<li><a href="#">Fête de Noël</a></li>
<li><a href="#">Carnaval</a></li>
<li><a href="#">Sortie fin d'année</a></li>
<li><a href="#">Promenades</a></li>
[...]
</ul>
<a href="#">Aides</a>
<ul class="sousMenu">
<li><a href="#">Liens utiles</a></li>
<li><a href="#">Album photos</a></li>
<li><a href="#">Contact</a></li>
</ul>
</li>

body
{
font: 11px verdana, sans-serif;
background: #AFA99B url("fond.jpg") top left no-repeat;
margin: 0;
padding: 0;
}
#menuDeroulant
{
width: 644px;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
}
#menuDeroulant li
{
float: left;
margin: 0;
padding: 0;
border: 0;
}
#menuDeroulant .sousMenu
{
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
}
#menuDeroulant .sousMenu li
{
float: none;
margin: 0;
padding: 0;
border: 0;
}
#menuDeroulant li
{
float: left;
width: 150px;
margin: 0;
padding: 0;
border: 0;
}
#menuDeroulant li a:link, #menuDeroulant li a:visited
{
display: block;
height: 1%;
color: #FFF;
background: #3B4E77;
margin: 0;
padding: 4px 8px;
border-right: 1px solid #fff;
text-decoration: none;
}
#menuDeroulant li a:hover { background-color: #F2462E; }
#menuDeroulant li a:active { background-color: #5F879D; }

#menuDeroulant .sousMenu li a:link,
#menuDeroulant .sousMenu li a:visited
{
display: block;
color: #FFF;
margin: 0;
border: 0;
text-decoration: none;
background: transparent url("fondTR.png") repeat;
}
#menuDeroulant .sousMenu li a:hover
{
background-image: none;
background-color: #F2462E;
}
#menuDeroulant .sousMenu li
{
float: none;
margin: 0;
padding: 0;
border: 0;
width: 149px;
border-top: 1px solid transparent;
border-right: 1px solid transparent;
}
#menuDeroulant .sousMenu
{
display: none;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
}

#menuDeroulant li:hover > .sousMenu { display: block; }
#menuDeroulant
{
width: 644px;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
position: absolute;
top: 0;
left: 0;
}

Merci de vos bons conseils pour la mise en place sur mon site.. Avec mes remerciements pour votre gentillesse et au plaisir.
Silkounet