不寻常的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;
}