Dropdownmenüs

[quatermain]

Guten Abend.. Bin mit folgendem Problem konfrontiert.. Habe ein Dropdownmenü als Navi erstellt..

<ul id="nav">  
	<li><a href="home.php?page=aktuell" class="stylenavi">NEWS</a>  
		<ul>  
		  <li><a href="home.php?page=aktuell"class="styleunavi">Aktuelles</a></li>  
		  <li><a href="home.php?page=archiv"class="styleunavi">Archiv</a></li>  
  
  
		</ul>  
	</li>  
  
	<li><a href="home.php?page=verein"class="stylenavi">VEREIN</a>  
		  
	</li>  
  
</ul>

Das ganze ist mit folgendem css-style versehen..:

<style type="text/css">  
#nav, #nav ul {  
	padding: 0;  
	margin: 0;  
	list-style: none;  
	  
}  
  
#nav a {  
	display: block;  
 	padding: 4px;  
	  
}  
  
#nav a:hover {  
	display: block;  
 	padding: 4px;  
	background-color:#990000;  
}  
  
#nav li {  
	float: left;  
	padding: 4px;  
	  
}  
#nav li ul {  
	position: absolute;  
	padding: 4px;  
	width:7em;  
	left: -999em;  
}  
  
#nav li:hover ul {  
	left: auto;  
	  
}  
  
sfHover = function() {  
	var sfEls = document.getElementById("nav").getElementsByTagName("LI");  
	for (var i=0; i<sfEls.length; i++) {  
		sfEls[i].onmouseover=function() {  
			this.className+=" sfhover";  
		}  
		sfEls[i].onmouseout=function() {  
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");  
		}  
	}  
}  
if (window.attachEvent) window.attachEvent("onload", sfHover);  
  
#nav li:hover ul, #nav li.sfhover ul {  
	left: auto;  
	  
}

Das Problem ist nun das folgende: Im Firefox ist alles tiptop, doch im IE verschwinden die Dropdowns nicht mehr wenn die Maus das Menü verlässt, sondern erst beim nächsten Klick auf einen Menüpunkt.

Kann mir jemand helfen?

Gruss Jan