Menu desplegable CSS, a veces no despliega...

[webefects]

Hola Triby gracias por el interés

CODIGO CSS:
-----------------


BODY {
FONT-FAMILY: Trebuchet MS, Arial, Helvetica, sans-serif;
}
img {
border:0px;
}
#nav {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
LINE-HEIGHT: 1;
PADDING-TOP: 0px;
LIST-STYLE-TYPE: none;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
}
#nav UL {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
LINE-HEIGHT: 1;
PADDING-TOP: 0px;
LIST-STYLE-TYPE: none;/*width:250px;*/
}
#nav A {
DISPLAY: block;
WIDTH: 16em;
color:#FFFFFF;
text-decoration:none;
}
#nav LI {
FLOAT: left;/*WIDTH: 10em;*/

}
#nav LI UL {
BACKGROUND: white;
LEFT: -999em;
WIDTH: 16em;
POSITION: absolute;
border-top-width: 1px;
border-right-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-left-style: solid;
border-top-color: #072294;
border-right-color: #072294;
border-left-color: #072294;
}
#nav LI UL A {
padding:0.5em;
border-bottom-color:#072294;
border-bottom-style:solid;
border-bottom-width:1px;
WIDTH: 15em;
color:#072294;
}
#nav LI UL A:hover {
background-color:#072294;
color:#ffffff;
}
#nav LI UL UL {
/*MARGIN: -2.4em 0px 0px 16em;*/
MARGIN: -2.22em 0em 0em 16em !important;
BACKGROUND: white;
}
#nav LI UL UL UL {
MARGIN: -2.22em 0em 0em 16em !important;
BACKGROUND: white !important;
}
#nav LI:hover UL UL {
LEFT: -999em;
}
#nav LI:hover UL UL UL {
LEFT: -999em;
}
#nav LI.sfhover UL UL {
LEFT: -999em;
}
#nav LI.sfhover UL UL UL {
LEFT: -999em;
}
#nav LI:hover UL {
LEFT: auto;
}
#nav LI LI:hover UL {
LEFT: auto;
}
#nav LI LI LI:hover UL {
LEFT: auto;
}
#nav LI.sfhover UL {
LEFT: auto;
}
#nav LI LI.sfhover UL {
LEFT: auto;
}
#nav LI LI LI.sfhover UL {
LEFT: auto;
}
#content {
CLEAR: left;
COLOR: #ccc;
}



CODIGO JAVASCRIPT:
--------------------------


sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagNam e("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);


El menú trabaja solo con esos 2 archivos.

GraciasMiguel