Menu vertical déroulant déconne sous firefox

Salut, dans le cadre d'un stage je réalise un site internet. Voulant en profiter pour apprendre le php et les feuilles de style css, j'ai bâti mon site sur le CMS Itseasy.
J'ai aussi intégré un menu déroulant vertical que j'avais trouvé sur le site alsacréation. Dans la boite où je bosse, le site marche très bien, sous IE.
Ce soir je rentre chez moi avec une copie du site et horreure le menu déconne à fond sous firefox. Etant donné que firefox respecte beaucoup mieux les standarts je pense que le souci viens de mon code.
Voici l'url d'une page de mon site :
http://prc.rezoo.org/sivom
et le css correspondant :

body {
margin:0em;
margin-top:0.5em;
padding:0em;
background:#F2F2F2;
background-repeat:repeat-y;
color:#000;
font-family:"Trebuchet MS", verdana, sans-serif;
font-size:0.75em;
}

.sn_date
{
font-size : 0.9em;
color : #001EFF;
text-align : justify;
}
.sn_new
{
font-size : 1.0em;
color : #000000;
text-align : justify;
}


#menu {
position: float;
top: 10em;
left: 1em;
width: 10em;
}

#menu ul {
margin: 0em;
padding:2px;
list-style: none;
float : left;
width : 11em;
}

#menu li {
color:#666;
font-weight:bold;
text-align: left;
font-size: 85%;
height: 20px;
line-height: 20px;
background:#fff;

}

#menu li ul {
font-size: 120%;
}

#menu li ul li{
margin-left : 0.3em;
}

#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
}

#menu li a:hover {
color :#0099FF ;
}

.lien_sortant {
margin-right:18px;
background:url("./images/out.png");
background-repeat:no-repeat;
}

.admin  {
background:#FFF3F1;
}

.system {
background:#F6FFF3;
}

blockquote {
margin:1em;
padding:1em;
background:#dbf2fc;;
-border:5px solid #dbf2fc;;
-moz-border-radius:5px;
}

.bb_area {
width:90%;
}

h1 {
font-size:1.4em;
color:#0099FF;
margin-top:1.4em;
margin-bottom:1.4em;
}

h2 {
font-size:1.2em;
margin-top:0em;
color:#666;/*#087CAE;*/
margin-top:1.3em;
margin-bottom:1.3em;
}


h3 {
font-size:1em;
margin-top:0em;
color:#087CAE;
margin-top:1.3em;
margin-bottom:1.3em;
}


strong {
font-weight:bold;
color:#444;
}

acronym {
border-bottom:0.1em dotted #666;
}

ul {
margin-top:1.5em;
margin-bottom:1.5em;
}

li {
margin-top:0.8em;
margin-bottom:0.8em;
}

input, textarea {
border:1px solid #DEDEDE;
border-top:2px solid #DEDEDE;
border-left:2px solid #DEDEDE;
background:#dbf2fc;
margin-top:0.3em;
margin-bottom:0.3em;
font-size:0.8em;
}

textarea {font-size:1em;width:80%;}

input:hover {
background:#f4fbfe;
}

p {
line-height:1.7em;
}

a:link, a:visited {
color:#666;
text-decoration:underline;
}

a:hover {
color:#0099FF;
text-decoration:underline;
}

.spacer {
border:0em;
clear:both;
margin:0em;
padding:0em;
width:0em;
}

.structure {
padding:0em;
background:#fff;
border-left:1px solid #CDCDCD;
border-right:1px solid #CDCDCD;
width:780px;
margin:auto;
}

.conteneur {
background:#fff;
background-position:bottom;
}

.header {
height:65px;
border-bottom:1px solid #CDCDCD;
background:url("./images/header.png") #0ba6eb;
color:#000;
font-size:0.5em;
}

.gauche {
float:left;
width:20%;
background:#fff;
}

.block_sommaire_gauche {
margin:0em;
}

.block_sommaire_gauche a:link, .block_sommaire_gauche a:visited {
text-decoration:none;
border:0em;
}

.block_sommaire_gauche a:hover {
color:#0099FF;
}

.block_sommaire_gauche p {
margin:0em;
padding-top:0.3em;
padding-bottom:0.3em;
text-indent:0.5em;
color:#666;
font-weight:bold;
border-bottom:1px dotted #DEDEDE;
background:#fff;
}

.block_sommaire_gauche ul {
margin:0em;
padding:0em;
text-indent:1em;
list-style: none;
float : left;
width : 11em;
}

.block_sommaire_gauche li {
list-style-position:relative;
list-style-type:none;
float : left;
line-height : 1.25em;
width: 11em;
margin-top:0em;
margin-bottom:0em;
padding-top:0.3em;
padding-bottom:0.3em;
background:#fff;
}

.block_sommaire_gauche li a:link, .block_sommaire_gauche li a:visited {
text-decoration:none;
font-weight:normal;
color:#000;
}

.block_sommaire_gauche li a:hover {
color:#0099FF;
}

.droite {
float:left;
width:20%;
background:#fff;
}

.block_sommaire_droite {
margin:0em;
}

.block_sommaire_droite h1 {
margin:0em;
padding-top:0.3em;
padding-bottom:0.3em;
text-indent:0.5em;
color:#666;
font-weight:bold;
border-bottom:1px dotted #DEDEDE;
background:#fff;
font-size:1em;
text-decoration:none;
}

.block_sommaire_droite h1 a {
text-decoration:none;
border:0em;
}

.block_sommaire_droite h1 a:link, .block_sommaire_droite h1 a:visited {
text-decoration:none;
border:0em;
}

.block_sommaire_droite h1 a:hover {
color:#0099FF;
}

.block_sommaire_droite p, .block_sommaire_droite ul {
margin:0em;
padding:0.8em;
text-align:justify;
background:#fff;
}

.block_sommaire_droite ul {
padding:0em;
padding-left:0.8em;
padding-right:0.8em;
padding-bottom:1em;
}

.block_sommaire_droite li {
list-style-position:inside;
padding:0em;
margin:0em;
text-indent:1em;
}

.article_locked {
margin:0em;
background:url("./images/fond_article.png") #fff;
}

.article {
float:left;
width:59%;
margin-top:0em;
margin-bottom:0em;
background:url("./images/fond_article.png") #fff;
border-right:1px dotted #DEDEDE;
border-left:1px dotted #DEDEDE;
}

.contenu_article {
padding:1.5em;
padding-top:0em;
text-align:justify;
}

.contenu_article hr {
border:0em;
border-bottom:1px dotted #999;
background:#fff;
margin:auto;
margin-top:1.8em;
margin-bottom:1.8em;
width:80%;
text-align:center;
}

.footer {
font-size:0.8em;
padding:0.8em;
text-align:right;
border-top:1px solid #CDCDCD;
border-bottom:1px solid #CDCDCD;
background:url("./images/footer.png") #0ba6eb;
background-position:bottom;
color:#fff;
}

.powered {
font-size:0.85em;
text-align:center;
color:#666;
}

.generation {
width:99%;
text-align:center;
margin:1em;
font-size:0.8em;
color:#666;
}

.red {
color:red;
}

.previsualisation {
background:#fff;
margin:0.5em;
padding:1em;
border:1px solid #cad0d8;
}

.localisation {
font-size:0.9em;
background:#fff;
padding:0.3em;
border-top:1px solid #fff;
border-bottom:1px dotted #DEDEDE;
}

.editeur {
height:500px;
width:90%;
}

table {
border:1px solid #CAD0D8;
background:#fff;
padding:0.5em;
border-collapse:collapse;
letter-spacing:-1px;
text-align:center;
}

th {
background:#dbf2fc;
color:#666;
text-align:center;
padding:0.3em;
}

td {
border:1px solid #CAD0D8;
background:#fff;
padding:0.3em;
}

img a:link, img a:hover, img a:visited, img {
border:0em;
}


samp {
font-size:1em;
background:#fff;
padding:1em;
border:1px solid #dbf2fc;
border-left:1em solid #dbf2fc;
display:block;
}

pre {
font-size:1em;
background:#fff;
padding:1em;
border:1px solid #CAD0D8;
border-left:1em solid #CAD0D8;
}

Désolé pour la longueur, il faudrais que j'y fasse le ménage.
Si quelqu'un pouvait y jeter un coup d'oeil se serait sympa [:itm]
Merci

ps : je sais pas si je poste dans la bonne section

Porco a écrit :

J'ai aussi intégré un menu déroulant vertical que j'avais trouvé sur le site alsacréation...

ps : je sais pas si je poste dans la bonne section

Salut,

En effet, ce n'est pas le bon salon. Il y'a un salon dédié au "service après vente" des tutoriels.

Je déplace

Ok merci, c'est vrai que j'ai repris le menu vertical déroulant qui se trouve ici Merci de l'avoir mis au bon endroit.
Je l'ai un peu modifier en enlevant les dt et dd, c'est peut etre de là que vient le problème sous firefox, non ?
Modifié par Porco (29 Jun 2005 - 08:51)

J'ai résolu mon problème en remettant les dd et dt comme dans l'exemple originale. Ensuite j'ai eu un soucis de clignotement dans firefox, j'ai modifier le code js. J'ai remplacé les onmouseover et les onmouseout par des onclick.
J'ai du rajouter dans mes sous-menus des liens

<a href="#">[ Fermer ]</a>

qui permettent de fermer le sous-menus sans forcément aller sur une autre page.