Erreur de calque

Hello à tous,

Je rencontre un problème de superposition des calques.
J'ai un menu que je met sur www.toilef1.com/forums et j'ai un problème avec Firefox uniquement. Voici un aperçu après le test :
Firefox :
http://img215.imageshack.us/img215/7404/ffpj4.jpg

IE :
http://img399.imageshack.us/img399/3384/ieuo2.jpg

Dans la page que j'inclu j'ai la chose suivante :

<style>
#tab 
{
	margin:0;
	top:0;
}
#tab ul 
{
	margin:0;
	padding:0;
	list-style:none;
	float:left;
	text-align:left;
}
#tab li 
{
display:inline;
	float:left;
	margin:0 0 0 0 ;
	padding:0;
}
#tab a 
{
	margin:0;
	padding:0;
	text-decoration:none;
	border:0;
	display:block;
	float:left;
	text-align:left;
}
#tab a span 
{
	display:block;
	padding: 2px 15px 0 15px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#000000;
	font-weight:bold;
	line-height:20px;
}
#tab a:hover,#tab li.item_active a 
{
	background-position:right bottom;
	border-color:#000000;
}
#tab a:hover span,#tab li.item_active a span 
{
	background-position:left bottom;
	color:#FFF;
	font-weight:bold;
	font-style:normal;
	text-decoration:none;
	
	
}
.dropmenudiv
{
	position:absolute;
	top:0;
	float:left;
	display:block;
	visibility:hidden;
	border:0 solid #330066;
	background: #FFF;
	color:#FFF;
	opacity: 0.80;
	filter : alpha(opacity=80);
	z-index: 600;
	text-decoration:none;
	padding:0;
}
.dropmenudiv ul 
{
	margin:0;
	padding:0;
	list-style:none;
		text-align:left;

}
.dropmenudiv li 
{
	display:inline;
	margin:0;
	padding:0;
		text-align:left;

}
.dropmenudiv a:link, .dropmenudiv a:visited
{
	width:600px;
	margin:0 0 0 0;
	padding:0;
	display:block;
	border:0 solid #FFFFFF;
	color:#000000;
	font-family:verdana;
	background:#FFFFFF;
	font-style:normal;
	text-decoration:none;
	font-size: 11px;
	line-height:16px;
	font-weight: bold;
		text-align:left;

}
.dropmenudiv a span 
{
	float:left;
	display:block;
	line-height:15px;
	background:#CCC;
	opacity: 0.30;
	padding:0 15px 0 15px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11;
	color:#000000;
		text-align:left;

	
}
</style>
<script>
//Chrome Drop Down Menu- Author: Dynamic Drive (http://www.dynamicdrive.com)
//Last updated: June 14th, 06' v2.0

var cssdropdown={
disappeardelay: 1500, //set delay in miliseconds before menu disappears onmouseout
disablemenuclick: false, //when user clicks on a menu item with a drop down menu, disable menu item's link?
enableswipe: 1, //enable swipe effect? 1 for yes, 0 for no

//No need to edit beyond here////////////////////////
dropmenuobj: null, ie: document.all, firefox: document.getElementById&&!document.all, swipetimer: undefined, bottomclip:0,

getposOffset:function(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
},

swipeeffect:function(){
if (this.bottomclip<parseInt(this.dropmenuobj.offsetHeight)){
this.bottomclip+=10+(this.bottomclip/10) //unclip drop down menu visibility gradually
this.dropmenuobj.style.clip="rect(0 auto "+this.bottomclip+"px 0)"
}
else
return
this.swipetimer=setTimeout("cssdropdown.swipeeffect()", 10)
},

showhide:function(obj, e){
if (this.ie || this.firefox)
this.dropmenuobj.style.left=this.dropmenuobj.style.top="-500px"
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover"){
if (this.enableswipe==1){
if (typeof this.swipetimer!="undefined")
clearTimeout(this.swipetimer)
obj.clip="rect(0 auto 0 0)" //hide menu via clipping
this.bottomclip=0
this.swipeeffect()
}
obj.visibility="visible"
}
else if (e.type=="click")
obj.visibility="hidden"
},

iecompattest:function(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
},

clearbrowseredge:function(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=this.ie && !window.opera? this.iecompattest().scrollLeft+this.iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
this.dropmenuobj.contentmeasure=this.dropmenuobj.offsetWidth
if (windowedge-this.dropmenuobj.x < this.dropmenuobj.contentmeasure)  //move menu to the left?
edgeoffset=this.dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=this.ie && !window.opera? this.iecompattest().scrollTop : window.pageYOffset
var windowedge=this.ie && !window.opera? this.iecompattest().scrollTop+this.iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
this.dropmenuobj.contentmeasure=this.dropmenuobj.offsetHeight
if (windowedge-this.dropmenuobj.y < this.dropmenuobj.contentmeasure){ //move up?
edgeoffset=this.dropmenuobj.contentmeasure+obj.offsetHeight
if ((this.dropmenuobj.y-topedge)<this.dropmenuobj.contentmeasure) //up no good either?
edgeoffset=this.dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
},

dropit:function(obj, e, dropmenuID){
if (this.dropmenuobj!=null) //hide previous menu
this.dropmenuobj.style.visibility="hidden" //hide menu
this.clearhidemenu()
if (this.ie||this.firefox){
obj.onmouseout=function(){cssdropdown.delayhidemenu()}
obj.onclick=function(){return !cssdropdown.disablemenuclick} //disable main menu item link onclick?
this.dropmenuobj=document.getElementById(dropmenuID)
this.dropmenuobj.onmouseover=function(){cssdropdown.clearhidemenu()}
this.dropmenuobj.onmouseout=function(e){cssdropdown.dynamichide(e)}
this.dropmenuobj.onclick=function(){cssdropdown.delayhidemenu()}
this.showhide(this.dropmenuobj.style, e)
this.dropmenuobj.x=this.getposOffset(obj, "left")
this.dropmenuobj.y=this.getposOffset(obj, "top")
this.dropmenuobj.style.left=this.dropmenuobj.x-this.clearbrowseredge(obj, "rightedge")+"px"
this.dropmenuobj.style.top=this.dropmenuobj.y-this.clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+1+"px"
}
},

contains_firefox:function(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
},

dynamichide:function(e){
var evtobj=window.event? window.event : e
if (this.ie&&!this.dropmenuobj.contains(evtobj.toElement))
this.delayhidemenu()
else if (this.firefox&&e.currentTarget!= evtobj.relatedTarget&& !this.contains_firefox(evtobj.currentTarget, evtobj.relatedTarget))
this.delayhidemenu()
},

delayhidemenu:function(){
this.delayhide=setTimeout("cssdropdown.dropmenuobj.style.visibility='hidden'",this.disappeardelay) //hide menu
},

clearhidemenu:function(){
if (this.delayhide!="undefined")
clearTimeout(this.delayhide)
},

startchrome:function(){
for (var ids=0; ids<arguments.length; ids++){
var menuitems=document.getElementById(arguments[ids]).getElementsByTagName("a")
for (var i=0; i<menuitems.length; i++){
if (menuitems[i].getAttribute("rel")){
var relvalue=menuitems[i].getAttribute("rel")
menuitems[i].onmouseover=function(e){
var event=typeof e!="undefined"? e : window.event
cssdropdown.dropit(this,event,this.getAttribute("rel"))
}
}
}
}
}

}
</script>
<div id="MainMenu">
	<div id="tab">

		<ul>
<li><a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu_104')"><span><font color="#468910" style="font-family:verdana">Les derni&egrave;res actus </font></span></a></li>
		</ul>
	</div>
</div>

<div id="dropmenu_104" class="dropmenudiv">
	<ul>
		<li>
 

		<?php 
$sql = "SELECT * FROM spip_articles ORDER BY date DESC,id_article DESC LIMIT 15";
$req= mysql_query($sql) or die('Une Erreur SQL !<br>'.$sql.'<br>'.mysql_error());   
while($data = mysql_fetch_array($req)){
		?>

<a href="http://www.toilef1.com/article.php3?id_article=<?php echo $data['id_article']?>" title="F1 - <?php echo $data['titre']?>">&#9679; <?php echo $data['date']?> : <?php echo  utf8_encode($data['titre'])?></a>
<?php } ?>

</li>
	</ul>

</div> 

Avez-vous une idée du problème ?

merci d'avance [/i][/i][/i]