I'm dealing with a navigation menu that has nested ul li elements. The goal is to have the nested ul displayed only when the parent li element is hovered over.
ul#menu_system ul {
width:200px;
display:none;
position:absolute;
left:0;
top:100%;
-moz-box-shadow:0 3.5px 12px #000000;
-webkit-box-shadow:0 3.5px 12px #000000;
box-shadow:0 3.5px 12px #000000;
background-color:#ececec;
border-width:0px;
padding:0 10px 10px;
}
ul#menu_system li:hover > ul
{
display:block;
}
While everything functions correctly in Firefox and Chrome, Internet Explorer is only showing the box shadow on hover and nothing else. Any suggestions or solutions would be greatly appreciated.