Internet Explorer（前11）显示菜单栏链接周围的轮廓

Question

我知道你在想什么 - 谁还关心IE呢？好吧，我的客户呢。问题是当您单击菜单栏链接时，菜单栏链接周围会出现虚线轮廓。我在IE 11中尝试过它并没有问题。因此，对于使用旧版IE的人来说，这只是一个问题。在Chrome，Firefox和任何其他相关浏览器中也很好，但我想我还是会问。

网站为precisionimagerycorp.com

HTML

<ul id="menu-bar">
<li><a href="">Home &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; |</a></li>
<li><a href="about.html"> About&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; |</a></li>
<li><a href="">Blog &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; |</a></li>
<li><a href="contact_us.html">Contact&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; |</a></li>
<li><a href="loginform2.php">Client Login</a></li> <br /><br />
<li><a href="register.php">

CSS

a:link{
color:#003;
text-decoration:none;
}
a:visited{
color:#003;
text-decoration:none;   
}
#menu-bar {
margin-left: 0px;
margin-top: 0px;    
padding: 25px 0px 0px 115px;
height: 34px;
line-height: 100%;
/*border-radius: 24px;
-webkit-border-radius: 24px;
-moz-border-radius: 24px;
box-shadow: 2px 2px 3px #666666;
-webkit-box-shadow: 2px 2px 3px #666666;
-moz-box-shadow: 2px 2px 3px #666666;
background: #8B8B8B;
filter:alpha(opacity:0);
background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#000));
background: -moz-linear-gradient(top,  #FFF,  #000);
border: none;*/
}
#menu-bar li {
margin: 0px 0px 0px 0px;
padding: 0px 0px 6px 0px;
float: left;
position: relative;
list-style: none;
}
#menu-bar a {
font-weight: bold;
font-family: arial;
font-style: normal;
font-size: 14px;
color: #FFFFFF;
text-decoration: none;
display: block;
padding: 8px 20px 8px 0px; /*The value on the far right determines menu bar placement */
margin: 0;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
text-shadow: 2px 2px 3px #000000;
}
/*#menu-bar .current a, #menu-bar li:hover > a {
background: #0399D4;
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr=#EBEBEB, endColorstr=#A1A1A1);
background: -webkit-gradient(linear, left top, left bottom, from(#EBEBEB), to(#A1A1A1));
background: -moz-linear-gradient(top,  #EBEBEB,  #A1A1A1);
color: #570058;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
text-shadow: 2px 2px 3px #FFFFFF;*/
}
#menu-bar .current a, #menu-bar li:hover > a {

}
#menu-bar ul li:hover a, #menu-bar li:hover li a {
background: none;
border: none;
color: #666;
-box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
}
#menu-bar ul a:hover {
background: #0399D4 !important;
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr=#04ACEC, endColorstr=#0186BA);
background: -webkit-gradient(linear, left top, left bottom, from(#04ACEC), to(#0186BA))       `enter code here`!important;
background: -moz-linear-gradient(top,  #04ACEC,  #0186BA) !important;
color: #FFFFFF !important;
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
text-shadow: 2px 2px 2px #FFFFFF;
}
#menu-bar ul {
background: #DDDDDD;
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFF, endColorstr=#CFCFCF);
background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#CFCFCF));
background: -moz-linear-gradient(top,  #FFFFFF,  #CFCFCF);
display: none;
margin: 0;
padding: 0;
width: 180px;
position: absolute;
top: 30px;
left: 0;
border: 0;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-webkit-box-shadow: 2px 2px 3px #222222;
-moz-box-shadow: 2px 2px 3px #222222;
box-shadow: 2px 2px 3px #222222;
}
#menu-bar li:hover > ul {
display: block;
}
#menu-bar ul li {
float: none;
margin: 0;
padding: 0;
}
#menu-bar ul a {
padding:10px 0px 10px 15px;
color:#424242 !important;
font-size:12px;
font-style:normal;
font-family:arial;
font-weight: normal;
text-shadow: 2px 2px 3px #FFFFFF;
}
#menu-bar ul li:first-child > a {
border-top-left-radius: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-topleft: 10px;
border-top-right-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topright: 10px;
}
#menu-bar ul li:last-child > a {
border-bottom-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomright: 10px;
}
#menu-bar:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#menu-bar {
display: inline-block;
}
html[xmlns] #menu-bar {
display: block;
}
* html #menu-bar {
height: 1%;
}