不寻常的a：悬停行为（IE 8）

Question

我有一个导航菜单，可以改变悬停时的背景颜色。以下是两张图片。第一张图片显示了我在所有浏览器中都有的行为，但IE 8（未测试过8以下的任何内容）。第二张图片显示了IE 8中的行为。我希望IE 8看起来像其他所有内容（填充导航栏）。我还发布了菜单的CSS和ASP.Net。任何帮助表示赞赏！

ASP.Net

<ul id="mainNav" runat="server"> 
    <li><asp:HyperLink runat="server" NavigateUrl="~/Home.aspx">Home</asp:HyperLink></li> 
    <li><asp:HyperLink runat="server" NavigateUrl="~/Vendors.aspx">Our Vendors</asp:HyperLink></li> 
    <li><asp:HyperLink runat="server" NavigateUrl="#">Customer Support</asp:HyperLink></li> 
    <li><asp:HyperLink runat="server" NavigateUrl="#">Technical Assistance</asp:HyperLink></li> 
    <li><asp:HyperLink runat="server" NavigateUrl="SalesExecutives.aspx">AMS Sales Assistance</asp:HyperLink></li> 
</ul> 

CSS

ul#mainNav { 
    float: right; 
    margin: 8px 0 0 0; 
} 

ul#mainNav li { 
    font-size: 14px; 
    color: #746935; 
    float: left; 
} 

ul#mainNav li a { 
    color: #746935; 
    text-decoration: none; 
    padding: 8px 8px 9px 8px; 
} 

ul#mainNav li a:hover, ul#mainNav li a.active { 
    color: #ffffff; 
    background-color: #746935; 
    padding: 8px 8px 9px 8px; 
} 

Answer 1

让您a元素display: block：

ul#mainNav li a { 
    display: block; 

    color: #746935; 
    text-decoration: none; 
    padding: 8px 8px 9px 8px; 
}