请参阅我在下面的网站上使用的菜单。它在大多数浏览器中工作正常,但是当你将鼠标悬停在菜单项上时,IE10(IE11很好)然后选择子菜单项,当光标进入垂直子菜单项之间的任何小间隙时,菜单认为用户已离开子菜单并关闭。
有人可以告诉我在IE10中发生这种情况的原因是什么?
此致 马克
#nav-wrap {
height:28px;
position:relative;
top:-70px;
width:100%;
margin:0 auto;
z-index:10;
text-align:center;
}
#nav {
font-size:15px;
font-weight:400;
text-align:center;
position:relative;
display:inline-table;
}
#nav ul li:hover > ul {
display:block;
}
#nav ul {
padding:0px;
margin:0px;
list-style:none;
position:relative;
}
#nav ul:after {
content:"";
clear:both;
display:block;
}
#nav ul li { /* KEY - Changes main nav bar li style */
float:left;
margin-left:14px;
margin-right:14px;
}
#nav ul li a {
display:block;
color:white;
text-decoration:none;
background:#416b8f;
border-radius:2px;
padding:3px 15px 3px 15px;
}
#nav ul li a:hover {
background:#003768;
border-radius:0px;
-webkit-transition: ease-in 0.2s;
-moz-transition: ease-in 0.2s;
-o-transition: ease-in 0.2s;
transition: ease-in 0.2s;
}
.selected {
background:#003768;
display:block;
color:white;
text-decoration:none;
border-radius:2px;
padding:3px 15px 3px 15px;
}
#nav ul ul {
position:absolute;
top:100%;
text-align:left;
margin:0;
display:none;
}
#nav ul ul li {
float:none;
position:relative;
margin:0px;
font-size:14px;
padding-top:1px;
padding-bottom:1px;
padding-left:2px;
}
#nav ul ul li:hover {
}
#nav ul ul li a {
border-radius:0px;
padding-top:5px;
padding-bottom:5px;
}
#nav ul ul li a:hover {
background:#003768;
-webkit-transition: ease-in 0.2s;
-moz-transition: ease-in 0.2s;
-o-transition: ease-in 0.2s;
transition: ease-in 0.2s;
}
#nav ul ul ul {
position:absolute;
left:100%; /* switch to left to change position of nested menus */
top:0;
}
li {
white-space: nowrap;
}

<div id="nav">
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">ABOUT</a>
<ul>
<li><a href="#">ACET</a>
<ul>
<li><a href="#">ACET HELPS</a></li>
<li><a href="#">ACCREDITATION</a></li>
</ul>
</li>
<li><a href="#">FEATURES</a></li>
<li><a href="#">WEB DASHBOARD</a></li>
<li><a href="#">ACET 8</a></li>
<li><a href="#">CLIENTS</a></li>
<li class="selected">NEWS</li>
</ul>
</li>
<li><a href="#">SERVICES</a>
<ul>
<li><a href="#">TRAINING</a></li>
<li><a href="#">SUPPORT</a>
<ul>
<li><a href="#">HELP DESK</a></li>
<li><a href="#">USER GUIDE</a></li>
<li><a href="#">ACET TECHNICAL PRACTICE</a></li>
</ul>
</li>
<li><a href="#">DATA IMPORT</a></li>
<li><a href="#">DEVELOPMENT</a></li>
</ul>
</li>
<li><a href="#">ASSET INTEGRITY</a>
<ul>
<li><a href="#" target="_blank">INTEGRITY INFORMATION</a></li>
<li><a href="#" target="_blank">INSPECTION & INTEGRITY MANAGEMENT</a></li>
<li><a href="#" target="_blank">NON-DESTRUCTIVE TESTING</a>
<ul>
<li><a href="#" target="_blank">SPECIALIST INSPECTION SERVICES</a></li>
<li><a href="#">INSPECTION METHOD CAPABILITY</a></li>
<li><a href="#">INSPECTION METHOD SELECTION</a></li>
</ul>
</li>
<li><a href="#" target="_blank">DATA SOLUTIONS</a></li>
</ul>
</li>
<li><a href="#">DOWNLOADS</a>
<ul>
<li><a href="#" target="_blank">LATEST NEWSLETTER</a></li>
<li><a href="#" target="_blank">ACET DATA SHEET</a></li>
<li><a href="#" target="_blank">ASSET INTEGRITY BROCHURE</a></li>
<li><a href="#" target="_blank">THE INSPECTION STANDARD</a>
</li>
</ul>
</li>
</ul>
</div>
&#13;