problemas com menu drop down

bom to com 1 problema em faze um menu drop down

ja fiz de tdo e nada adiantaa....

ah possibilidade de vcs darem uma olhada no codigo?

segue:

>

<ul id="nav">

 <li class="font"><a href="#">LS-1,8D</a>

 <ul>

 <li><a href="#">Aço pintado</a></li>

 <li>Aço inoxidável</li>

 </ul>

 

 <li class="font"><a href="#">LS-3D</a>

 <ul>

 <li><a href="#">Aço pintado</a></li>

 <li>Aço inoxidável</li>

 </ul>

 </li>

 <li class="font"><a href="#">LS - 8D</a>

 <ul>

 <li>Aço pintado</li>

 <li>Aço inoxidável</li>

 </ul>

 </li>

 <li><span class="font"><a href="Modelos/12d.htm">LS - 12D</a></span>

 <ul>

 <li>Aço pintado</li>

 <li>Aço inoxidável</li>

 </ul>

 

 </ul>

tdo bem ateh ai acho q ta certoagora segue o codigo do css:

>
ul {

	margin: 1;

	padding: 1;

	list-style: none;

	width: 150;

	}

 

	ul li {

	position: relative;

	}

li ul {

	position: absolute;

	left: 149px;

	top: 0;

	display: none;

	}

 

 

	<ul id="nav">

	}

	ul li a {

	display: block;

	text-decoration: none;

	color: #777;

	background: #fff;

	padding: 5px;

	border: 1px solid #ccc;

	border-bottom: 0;

	}

 

	/* Fix IE. Hide from IE Mac \*/

* html ul li { float: left; }

* html ul li a { height: 1%; }

/ End /

ul {

	margin: 0;

	padding: 0;

	list-style: none;

	width: 150px;

	border-bottom: 1px solid #ccc;

	}

 

	li:hover ul, li.over ul {

	display: block; }

o codigo java pra funcionar eh esse :

startList = function() {

if (document.all&&document.getElementById) {

navRoot = document.getElementById("nav");

for (i=0; i<navRoot.childNodes.length; i++) {

node = navRoot.childNodes;

if (node.nodeName=="LI") {

node.onmouseover=function() {

this.className+=" over";

}

node.onmouseout=function() {

this.className=this.className.replace

(" over", "");

}

}

}

}

}

window.onload=startList;

 

galera ja fiz de tdoo mais esse menu num funciona.... da pra vcs me darem uma luz? ahh ou se tiver um metodo mais resumido de fazer esse menu eu seria mto grato

 

vlw galera espero resposta