dear all,

I have been trying to implement a simple menu system for a site I'm trying to actually do for myself (not a client!! well when i get chance to spend time on it anyway). Here is the basic code I am using:
Code:
<html>
<head>
	<title>Untitled</title>
	
	<style type="text/css">
	#menu1 { display : none}
	a:link {color:black; text-decoration:none }
	a:hover { color:blue; text-decoration:underline }
	</style>
</head>

<body>
<table width="200" border="0">
<tr>
<td valign="top" width="200">
<span onMouseOver="document.all.menu1.style.display='block'" onMouseOut="document.all.meu1.stye.display='none'">
Section1</span><br>
<span id="menu1" onClick="document.all.menu1.style.display='none'"  onMouseOut="document.all.meu1.stye.display='none'">
&nbsp;&nbsp;<a href="page1.html" target="_blank">page1</a><br>
&nbsp;&nbsp;<a href="page2.html" target="_blank">page2</a><br>
</span>
</td>
</tr>
</table>

</body>
</html>
what happens when the page loads up in IE5.5 is the main option is there but the expandable bit is hidden. When I rollover the main option, the layed becomes unhidden. When I click on an option in the expanded section, the menu minimizes again, (so that when the user is going through the options, there isn't the potential for a them all to be open at the same time) but I would really like it to minimize when I roll off it as well. I thought the code above would do that but it isn't. I added the:

Code:
 onMouseOut="document.all.meu1.stye.display='none'"
In the SPAN tag in the hope it would help but it didn't do anything different, anybody wanna help a frustrated coder?

Another thought, how would I go about making it Netscape (4.7x) compatible as well? Isn't there a slight difference in the javascript between the two browsers?

Thank-you for any help any of you can give, it's very much appreciated