Problème de fonctionnement du menu entre IE et FF

bonjour,
j'espère que cette fois-ci je serai dans la bonne catégorie et que Raphaël n'aura pas a déplacer ce ''post' !
Voilà, sur mon site principal,
http://www.unesourisetmoi.info
j'ai un menu, que je trouve fort pratique pour gérer ce genre de site qui a beaucoup de pages. Il fonctionne, pour les liens avec un fichier en *.htm et ensuite avec deux autres, l'un pour la css l'autre en *.php
Lorsque je visionne le site sous IE, pas de problèmes, mais sous FF alors-là c'est l'horreur !!!!
Les sous-menus sont décalés vers la gauche, au lieu de rester bien alignés verticalement, et selon les écrans sortent aussi du champ de vision ....
Je vous mets ici le code de la css:

#Menu 		{ 	width:1024px;					/* largeur 1ère ligne */
 				font-family:arial;      		/* police utilisée */
				font-size:12px;
				font-weight:bold;
				position:absolute	}
#Menu a		{	text-decoration:none;
				border:2px solid #FFCC99;		/* couleur de la bordure */
				background-color:#F1F100;		/* couleur normale du fond */
												/* height:???px; hauteur des lignes */
				display:block;
				color:#000080;	}
#Menu a:hover
			{ 	background-color:#CCFFFF;		/* couleur du fond quand on survole */
				}
#Menu li	{	width:128px;					/* largeur des libellés */
				margin-right:1;					/* espace à droite */
												/* padding:???px; et/ou margin:??px; séparation entre les lignes /colonnes */
				cursor:pointer;
				display:block;
				float:left;	}
#Menu ul	{	visibility:hidden;
				position:absolute;	}
#Menu ul li	{	float:none;
				display:block;
				left:-40px;						/* ajustements horizontaux des sous-menus 1er niveau */
				position:relative;	}
#Menu ul li ul
			{	float:none;
				position:absolute;
				left:128px;						/* ajustements horizontaux des sous-menus niveaux suivants */
				top:-1px;						/* ajustements verticaux des sous-menus niveaux suivants */
				visibility:hidden;	}
* html #Menu li li,* html #Menu li li li
			{	display:inline;	}
#Menu img	{	border:0;	}

et ici celui du fichier 'php':

<style type="text/css">
#Menu 		{ 	width:1050px;					/* largeur 1ère ligne */
 				font-family:vernada;      		/* police utilisée */
				font-size:12px;
				left:-40px;
                position:relative;
				font-weight:normal;
				text-align:center;	}
#Menu a		{	text-decoration:none;
				border:1px solid #000000;		/* couleur de la bordure */
				background-color:#FFC285;		/* couleur normale du fond */
												/* height:???px; hauteur des lignes */
				display:block;
				color:#000000;	}
#Menu a:hover
			{ 	background-color:#FFF0E0;		/* couleur du fond quand on survole */
				}
#Menu li	{	width:105px;					/* largeur des libellés */
				margin-right:1;					/* espace à droite */
												/* padding:???px; et/ou margin:??px; séparation entre les lignes /colonnes */
				cursor:pointer;
				display:block;
				float:left;	}
#Menu ul	{	visibility:hidden;
				position:absolute;	}
#Menu ul li	{	float:none;
				display:block;
				left:-90px;						/* ajustements horizontaux des sous-menus 1er niveau */
				position:relative;	}
#Menu ul li ul
			{	float:none;
				position:absolute;
				left:155px;						/* ajustements horizontaux des sous-menus niveaux suivants */
				top:-1px;						/* ajustements verticaux des sous-menus niveaux suivants */
				visibility:hidden;	}
* html #Menu li li,* html #Menu li li li
			{	display:inline;	}
#Menu img	{	border:0;	}
</style>

<?php include "../bgmenu/BulMenu.htm";	?>

<script type="text/javascript">
	var l=document.getElementById("Menu").getElementsByTagName('LI');
	for ( var n=0; n<l.length; n++ )
	{
		l[n].unselectable="on";	/* pour faire plus propre : "non sélectionnable", ne fonctionne pas avec FF ? */
		if ( l[n].getElementsByTagName('UL') && l[n].getElementsByTagName('UL').length>0 )
				{
					l[n].onmouseover = function()	
							{	
								this.getElementsByTagName('UL')[0].style.visibility="visible";	
							}	
					l[n].onmouseout = function()	
							{	
								this.getElementsByTagName('UL')[0].style.visibility="hidden";	
							}
					l[n].getElementsByTagName('A')[0].innerHTML+="&nbsp;<img src='../bgmenu/FlecheDroite.gif' />";
				}
		else	{
					l[n].getElementsByTagName('A')[0].innerHTML+="<img src='../bgmenu/FlecheDroite.gif' style='width:0;height:0;'/>";
					/* pour permettre de détecter le survol "hors du texte" avec IE */
				}
	}
</script>

je craque .... je ne parviens pas à résoudre ce problème !
si quelqu'un pouvait m'y aider ce serait super !
@mitiés
b g
Modifié par bg62 (11 Jun 2007 - 15:52)

personne pour m'aider ?
@mitiés
b g