我花了很多时间研究这个主题，我没有找到解决我的特定问题的方法，即使我遇到了类似的问题，但他们的解决方案似乎不适合我。我遇到的问题在任何非 IE 浏览器中都不存在。当我将鼠标悬停在主链接上以查看下拉列表时，我正在构建的网站的主导航 (#mainNav)，链接的焦点似乎只在实际文本上。所以，当我尝试将鼠标向下移动列表时，它不会比主链接文本更远，然后手变回箭头并且菜单消失。这是一个 CSS3 菜单在所有浏览器中成功地在另一个站点上工作，并且似乎没有任何 IE 修复，所以我抓住了代码并决定将它用于这个站点。一切都很顺利，直到我在 IE 中检查它：/
这些是我查看的区域（在这种情况下通常是问题）：显示块（存在于所有“a”标签上）、删除边距和增加填充（没有帮助）、分配高度值（没有帮助），增加行高（不）。我在其他博客中读到，链接上没有背景颜色可能是一个问题（不），还读到使用透明的 1px 图像可以解决问题（不）。当我说“不”时，假设我正确地合并了修复程序。
我非常感谢帮助！
这是CSS：
/* //////// MAIN NAVIGATION //////// */
/* Reset */
#navMain,
#navMain ul,
#navMain li,
#navMain a {
border:none;
font-weight:normal;
margin:0;
outline:none;
padding:0;
z-index:1000;
}
/* Menu */
#mainNav-wrap {
width:100%;
height:47px;
float:left;
background:#00aeef;
border-top:#014964 1px solid;
box-shadow: 0px 2px 2px #999999;
}
#navMain {
/*height:40px;*/
width:960px;
position:relative;
z-index:500;
margin:0 auto;
}
#navMain li {
display:block;
float:left;
height:40px;
list-style:none;
/*padding:40px 8px 0 4px;*/
position:relative;
text-transform:uppercase;
}
#navMain li li {
text-transform:capitalize;
}
/* Links */
#navMain li a {
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
color:#fff;
display:block;
font-size:18px;
line-height:18px;
font-family:'Raleway', sans-serif;
padding:15px 19px;
text-decoration:none;
text-shadow:0px 1px 1px rgba(0,0,0,.1);
transition:color .2s ease-in-out;
-webkit-transition:color .2s ease-in-out;
-moz-transition:color .2s ease-in-out;
-ms-transition:color .2s ease-in-out;
-o-transition:color .2s ease-in-out;
}
#navMain li:first-child a {border-left:none;}
#navMain li:last-child a{border-right:none;}
#navMain li:hover > a {background:#565454;color:#fff200;}
/* Sub Menu */
#navMain ul {
background: #565454;
border-radius: 0 5px 5px 5px;
-moz-border-radius: 0 5px 5px 5px;
-webkit-border-radius: 0 5px 5px 5px;
position:absolute;
left: 0;
top: 46px;
opacity: 0;
filter: alpha(opacity = 0);
transition: opacity .25s ease .1s;
-moz-transition: opacity .25s ease .1s;
-ms-transition: opacity .25s ease .1s;
-o-transition: opacity .25s ease .1s;
-webkit-transition: opacity .25s ease .1s;
min-width:200px;
}
#navMain ul.electronics {
min-width:350px;
}
#navMain li:hover > ul {opacity:1;filter: alpha(opacity = 100);}
#navMain ul li {
height:0;
overflow:hidden;
padding:0;
transition: height .25s ease .1s;
-moz-transition: height .25s ease .1s;
-ms-transition: height .25s ease .1s;
-o-transition: height .25s ease .1s;
-webkit-transition: height .25s ease .1s;
}
#navMain li:hover > ul li {height:38px;overflow:visible;padding:0;}
#navMain ul li a {
border:none;
color:#fff;display:block;
font-size:18px;
margin:4px 4px;
padding:8px 14px 8px 14px;
white-space:nowrap;
width:200px; /* Stretches Submenu */
}
#navMain ul li:last-child {margin-bottom:6px;}
#navMain ul li:last-child a {border:none;padding:4px 14px 1px 14px;}
#navMain ul li a:hover {background:none;}
#navMain ul li span {white-space:nowrap;}
.navMain_buffer {height:8px;}
/* ////////// MAIN CONTENT /////////// */
这是HTML：
<div id="mainNav-wrap">
<ul id="navMain">
<li><a href="#" title="Electronics">ELECTRONICS</a>
<ul class="electronics">
<li><a href="#" title="HDTVs 19"-32"">HDTVs 19"-32"</a></li>
<li><a href="#" title="HDTVs 37" and Up">HDTVs 37" and Up</a></li>
<li><a href="#" title="Gaming Systems">Gaming Systems</a></li>
<li><a href="#" title="HOME THEATER">Home Theater</a></li>
<li><a href="#" title="Stereos and Home Theater Systems">Stereos and Home Theater Systems</a></li>
<li><a href="#" title="Digital Cameras and Camcorders">Digital Cameras and Camcorders</a></li>
<li><a href="#" title="Digital Cameras and Camcorders">Small Electronics</a></li>
</ul>
</li>
<li><a href="#" title="Computers">Computers</a>
<ul>
<li><a href="#" title="Laptops">Laptops</a></li>
<li><a href="#" title="Tablets">Tablets</a></li>
<li><a href="#" title="Desktops">Desktops</a></li>
<li><a href="#" title="Computer Desks">Computer Desks</a></li>
</ul>
</li>
<li><a href="#" title="Appliances">APPLIANCES</a>
<ul>
<li><a href="#" title="Washer and Dryers">Washer and Dryers</a></li>
<li><a href="#" title="Refrigerators">Refrigerators</a></li>
<li><a href="#" title="Freezers">Freezers</a></li>
<li><a href="#" title="Ranges">Ranges</a></li>
</ul>
</li>
<li><a href="#" title="Bedrooms">Bedrooms</a>
<ul>
<li><a href="#" title="Bedroom Sets">Bedroom Sets</a></li>
<li><a href="#" title="Kid's Bedrooms">Kid's Bedrooms</a></li>
<li><a href="#" title="Mattresses">Mattresses</a></li>
</ul>
</li>
<li><a href="#" title="Dinning Rooms">Dinning Rooms</a></li>
<li><a href="#" title="Living Rooms">Living Rooms</a>
<ul>
<li><a href="#" title="Recliners">Recliners</a></li>
<li><a href="#" title="Sectionals">Sectionals</a></li>
<li><a href="#" title="Living Room Sets">Living Room Sets</a></li>
<li><a href="#" title="Accessories">Accessories</a></li>
</ul>
</li>
</ul>
</div><!-- /END main-nav-wrap -->