[thelist] suckerfish nav menu not working in IE

[Bruce Gilbert]

I am working on a menu based on the sickerfish idea detailed on
alistapart.com <http://alistapart.com>
It works in FF, but not in IE.
 I followed the directions to a tee (I think) and added the following JS per
the instructions
 startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (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;
 I also have in my XHTML code:
 <ul id="nav"><li>Nav stuff here
<ul>
<li>
Sub Nav
</li>
<li> sub nav2</li>
</ul>
<li>More nav stuff</li>
</ul>
 and in my CSS:

ul#nav {/*ul navigation attributes*/
margin: 0;
padding: 0 0 0 8em;
list-style-type: none;
white-space: nowrap;

}
ul#nav li {/*li attributes for navlist*/
float: left;
margin: 0;
padding-top: 10px;
width: 95px;
font: bold .85em verdana, arial, sans-serif;
position:relative;

}
ul#nav a:link {
margin: 0;
padding: 0;
color: #a0522d;
text-decoration: none;
background: inherit;
}
ul#nav a:visited {
margin: 0;
padding: 0;
color: #a0522d;
text-decoration: none;
background: inherit;
}
ul#nav a:hover {
text-decoration: underline;
}
ul#nav li#active {
color: #333;
background: inherit;
}

/*begin styling for menu drop downs on main navigation*/
ul#nav li ul { /* second-level lists */
display: none;
position: absolute;
top:0;
left: 0;
list-style-type:none;
}

ul#nav li>ul { /* to override top and left in browsers other than IE, which
will position to the top right of the containing li, rather than bottom left
*/
top:auto;
left:auto;
background-color:#ffd634;
padding-bottom:.2em;
border:1px solid #039;
width:13em;
}

ul#nav li:hover ul, li.over ul { /* lists nested under hovered list items */
display:block;
}

ul#nav li ul li a:link { /* second-level lists links */
color:#039;
text-decoration:none;
background-color:#inherit;

}

ul#nav li ul li a:visited { /* second-level lists links */
color:#0033CC;
text-decoration:none;
background-color:#inherit;
}

ul#nav li ul li a:hover { /* second-level lists links */
color:#0033CC;
text-decoration:underline;
background-color:#inherit;
}

ul#nav li ul li a:active { /* second-level lists links */
color:#039;
text-decoration:none;
background-color:#inherit;
}
/*end main nav styling*/

 any suggestions on why it may not be working in IE?

 also my subnav items are apprearing centered and I would like them to flush
left. How can I accomplish this in the CSS??

 thanks in advance for any assistance given!!!!

--
::Bruce::