Mise en page de menu différent ie/firefox

Bon voila j'en suis arrivé à vouloir me jeter par la fenetre pour mon menu.
J'ai mixer des bouts de code qui devrait marcher sauf que sous ie merveilleux sa marche mais sou firefox sa me décale toute ce qui se trouve dans le div en dessous après le dérouler du menu.

C'est agaçant...
Vous auriez une idée du pourquoi du comment ?

#menu {
	background-image: url(images/menu.png);
	background-repeat: no-repeat;
	height: 33px;
	width: 900px;
	position: relative;	
}

#menu ul {
	padding: 0px; 
	margin: 0px; 
	list-style-type:none; /* Cette ligne enlève les puces */
}

li.drop {
	display: block; 
	position:relative; 
	width: 100px; /* Largeur visible du bouton */
	height: 20px; 
	overflow:hidden; /* Permet de cacher la partie débordante de l'image  */
	float:left;
	border-right: solid 1px #000000; 
}

li.drop:hover {
	height:auto;
}

#menu ul li ul li {
	border-top: solid 1px #000000; 
}

*html #menu ul li ul li { float:left; }


#menu a {
	display:block;
	width:100px; 
	height: 20px;
	overflow:hidden;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#FF6600;
	text-decoration:none;
}


#menu a:hover {
	color:#FFFF99;
}

#menu span {
	display: block;
	position: relative;
	width: 200px; 
	height: 17px; 
	padding-top: 3px; 
	background-repeat:no-repeat; 
	cursor:pointer;
}