IE7 和 8 CSS 菜单背景下拉悬停问题

Question

希望有人能用一双新鲜的眼睛来帮忙，我一直在试图解决 IE7-8 中的一个问题，即当鼠标悬停在下拉菜单项上时会跳来跳去 - 一些负边距规则正在应用悬停（以及丑陋的块背景），我不明白为什么在 IE7-8 中而不是在其他浏览器中发生这种情况（即使是 IE6 我也可以正常工作！）。我已经在 app.css 样式表的底部注释掉了我的尝试。基本上，下拉菜单覆盖了 Twitter bootstrap 中的一些样式。它包含在 app.css 应用自定义样式之前。

这是一个[演示链接][1]（目前只有 dropout 菜单样式是问题，我意识到顶级项目不是很清晰！）

Answer 1

悬停背景是因为此代码来自 bootstrap.css 第 6 行。filter 属性用于在 ie.in 第 106 行 app.css 中应用渐变，所有属性都被覆盖但不过滤所以在 ie 那里是蓝色背景。

.dropdown-menu li > a:hover, .dropdown-menu li > a:focus, .dropdown-submenu:hover > a {
    color: white;
    text-decoration: none;
    background-color: #08C;
    background-color: #0081C2;
    background-image: -moz-linear-gradient(top,#08C,#0077B3);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#08C),to(#0077B3));
    background-image: -webkit-linear-gradient(top,#08C,#0077B3);
    background-image: -o-linear-gradient(top,#08C,#0077B3);
    background-image: linear-gradient(to bottom,#08C,#0077B3);
    background-repeat: repeat-x;
    filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff0088cc',endColorstr='#ff0077b3',GradientType=0);
    }