horizontal drop down menu

[casalawrence]

Sto cercando di usare l'horizontal drop down menu di alistapart per farne un menu da 2 a 3 livelli.
Cercando su questo forum ho trovato questo codice che applica gli stili alle classi anzichè all'id dei div:

// JavaScript Document

startList = function() {
if (document.all && document.getElementById && document.getElementsByTagName) {
var uls=document.getElementsByTagName('ul');
for(var k=0;k<uls.length;k++){
if(uls[k].className=='nav'){
navRoot=uls[k];
for(var i=0;i<navRoot.childNodes.length;i++){
node=navRoot.childNodes[i];
if(node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
}
}
window.onload=startList;
// JavaScript Document

Non riesco a far funzionare il terzo livello, credo che il problema sia negli stili, ma non ci sto raccapezzando:master: .
Questo il css:

ul {
margin: 1;
padding: 0;
list-style: none;
width: 120px;
border-bottom: 1px solid #ccc;
}

ul li {
position: relative;
}
li ul {
position: absolute;
left: 120px;
top: 0;
display: none;
}
ul li a {
display: block;
text-decoration: none;
color: black;
background: #fff;
padding: 1px;
border: 1px solid black;
border-bottom: 0;
}
li:hover ul, li.over ul {
display: block; }
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; }
* html ul li a { height: 1%; }
/* End */
{

e questo il menu:

<ul class="nav"> [*]Home [*]About
<ul> [*]History
<ul class="nav">[*]high[/list]
[*]Team [*]Offices [/list]
[*]Services
<ul> [*]Web Design [*]Internet Marketing [*]Hosting [*]Domain Names [*]Broadband [/list]
[*]Contact Us
<ul> [*]United Kingdom [*]France [*]USA [*]Australia [/list]
[/list]

chi mi aiuta?

[fcaldera]

usa questo che non richiede javascript
http://cssplay.co.uk/menus/flyout2.html

[casalawrence]

Direi.... perfetto!
Grazie infinite!!