Css IE和FF中twitter引导菜单的闪烁和错误位置

我对IE 9-10和Firefox中的Twitter引导菜单有问题。在演示链接中，当您将鼠标悬停在菜单项上时，它们会完全消失和/或闪烁。下拉菜单的位置也不对

我没有发现Chrome有任何问题，但IE 9-10有最明显的问题。Firefox有闪烁和下拉定位问题，但它似乎没有IE那么糟糕

有人能给我一些建议吗

演示：

来自IE inspector的HTML：

<DIV class=navbar>
<DIV class=navbar-inner>
    <DIV class=container><A class=brand href="http://google.com">Test</A>
        <nav class=nav-main role=navigation>
            <UL class="nav l_tinynav1" id=primary_navigation>
            <LI class=menu-about><A href="http://google.com">About</A></LI>
            <LI class="active dropdown menu-pages"><A class=dropdown-toggle href="#" data-target="#">Pages<B class=caret></B></A>
                <UL class=dropdown-menu>
                    <LI class=menu-blog><A href="http://google.com">Link1</A></LI>
                    <LI class="active menu-home"><A href="http://google.com">Link2</A></LI>
                    <LI class=menu-page-comments><A href="http://google.com">Link3</A></LI>
                    <LI class=menu-page-markup-and-formatting><A href="http://google.com">Link4</A></LI>
                </UL>
            </LI>
            <LI class="dropdown menu-depth"><A class=dropdown-toggle href="#" data-target="#">Link5<B class=caret></B></A>
                <UL class=dropdown-menu>
                    <LI class="dropdown-submenu menu-level-01"><A href="#">Level 01</A> 
                        <UL class=dropdown-menu>
                            <LI class=menu-level-02><A href="#">Level 02</A></LI>
                        </UL>
                    </LI>
                </UL>
            </LI>
        </nav>
    </DIV>
</DIV>

JS:

/*！http://tinynav.viljamis.com v1.1作者@viljamis*/
（函数（$，窗口，i）{
“严格使用”；
$.fn.tinyNav=函数（选项）{
//默认设置
变量设置=$.extend({
'active'：'active'，//字符串：设置“active”类
'header'：''，//字符串：指定“header”的文本并显示header而不是活动项
'label'：''//String:设置的文本（如果未设置，则不会添加标签）
}，选项）；
返回此。每个（函数（）{
//用于名称空间
i++；
var$nav=$（此），
//名称空间
命名空间='tinynav'，
名称空间_i=名称空间+i，
l_namespace_i='.l_'+namespace_i，
$select=$（''）.attr（“id”，名称空间_i）.addClass（名称空间+''+名称空间_i）；
如果（$nav.is（'ul，ol'））{
如果（settings.header！=''）{
$select.append(
$（''）.text（settings.header）
);
}
//构建选项
var选项=“”；
$nav
.addClass（'l_u'+名称空间_i）
.find（'a'））
.每个（功能）{
选项+=''；
var j；
对于（j=0；j<$（this）.parents（'ul，ol'）。length-1；j++）{
选项+='-'；
}
选项+=$（this）.text（）+''；
});
//将选项附加到选择列表中
$select.append（选项）；
//选择活动项
如果（！settings.header）{
$select
.find（':eq（'+$（l_名称空间_i+'li'））
.index（$（l_名称空间_i+'li.+settings.active））+'））
.attr（'selected'，true）；
}
//更改窗口位置
$select.change（函数（）{
window.location.href=$（this.val（）；
});
//注入选择
$（l_namespace_i）.after（$select）；
//注入标签
if（settings.label）{
$select.before(
$("")
.attr（“for”，名称空间_i）
.addClass（名称空间+“\U标签”+名称空间\U i+“\U标签”）
.append（settings.label）
);
}
}
});
};
})（jQuery，this，0）；
jQuery（函数（）{
“严格使用”；
jQuery（“主导航”）.tinyNav（）；
});

我解决了这个问题。我有额外的css，这导致了冲突

删除：

.nav>li>a:悬停{
显示：无；
}

解决了这个问题

.navbar {
margin-bottom: 0;
}

.navbar-inner {
background-color: #FFF;
background-image: none;
background-image: none;
background-image: none;
background-image: none;
background-image: none;
background-image: none;
background-repeat: no-repeat;
filter: none;
}

.navbar-fixed-top .navbar-inner, .navbar-static-top .navbar-inner {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
border-width: 0;        
}

/* Mobile nav desktop mode */
.tinynav { display: none }

@media (min-width: 980px) {
.navbar .brand {
    padding: 24px 20px 10px;
}

.navbar .nav>li {
    line-height: 40px;
}

.navbar .nav>li>a {
    text-shadow: none;
}

.navbar .nav .dropdown-toggle .caret {
    margin-top: 18px;
}

.nav-main>ul>li>a, .nav-main>ul>li>a:hover {
    border-top: 5px solid transparent;
}

.nav-main .active a, .nav-main>ul>li>a:hover, .nav-main ul li:hover>a, .dropdown.open a {
    border-top-color: #FFA500;
}

.navbar .nav li.dropdown.open>.dropdown-toggle, .navbar .nav li.dropdown.active>.dropdown-toggle, .navbar .nav li.dropdown.open.active>.dropdown-toggle, .navbar .nav>.active>a, .navbar .nav>.active>a:hover, .navbar .nav>.active>a:focus {
    background-color: inherit;
}

/*Make menu drop on hover*/
ul.nav li.dropdown:hover > ul.dropdown-menu{
    display: block;    
}

.nav>li>a:hover {
    display: none;
}

/* Remove arrow from top nav dropdown */
.navbar .nav > li > .dropdown-menu:after, .navbar .nav > li > .dropdown-menu:before    {
    content: none;
}

.dropdown-menu {
    margin: 0;
    border-top: 0;
    border-radius: 0;
}

.dropdown-submenu > .dropdown-menu {
    border-radius: 0;
}

.dropdown-menu {
    padding: 0;
}

.dropdown-menu > li > a {
    padding:8px 12px;
}

.dropdown-submenu > .dropdown-menu {
    margin-top: 0;
}

}

@media (max-width: 980px) {
/* Mobile nav */
.nav-main {
    position: relative;
}

.tinynav { 
    display: block;
    margin-top: 5px;
    position: absolute;
    right: 0;
}

.navbar .nav {
    display: none;
}
/* End Mobile nav */

} /* END (max-width: 980px) */

/*! http://tinynav.viljamis.com v1.1 by @viljamis */
(function ($, window, i) {
 "use strict";
$.fn.tinyNav = function (options) {

// Default settings
var settings = $.extend({
  'active' : 'active', // String: Set the "active" class
  'header' : '', // String: Specify text for "header" and show header instead of the active item
  'label'  : '' // String: sets the <label> text for the <select> (if not set, no label will be added)
}, options);

return this.each(function () {

  // Used for namespacing
  i++;

  var $nav = $(this),
    // Namespacing
    namespace = 'tinynav',
    namespace_i = namespace + i,
    l_namespace_i = '.l_' + namespace_i,
    $select = $('<select/>').attr("id", namespace_i).addClass(namespace + ' ' + namespace_i);

  if ($nav.is('ul,ol')) {

    if (settings.header !== '') {
      $select.append(
        $('<option/>').text(settings.header)
      );
    }

    // Build options
    var options = '';

    $nav
      .addClass('l_' + namespace_i)
      .find('a')
      .each(function () {
        options += '<option value="' + $(this).attr('href') + '">';
        var j;
        for (j = 0; j < $(this).parents('ul, ol').length - 1; j++) {
          options += '- ';
        }
        options += $(this).text() + '</option>';
      });

    // Append options into a select
    $select.append(options);

    // Select the active item
    if (!settings.header) {
      $select
        .find(':eq(' + $(l_namespace_i + ' li')
        .index($(l_namespace_i + ' li.' + settings.active)) + ')')
        .attr('selected', true);
    }

    // Change window location
    $select.change(function () {
      window.location.href = $(this).val();
    });

    // Inject select
    $(l_namespace_i).after($select);

    // Inject label
    if (settings.label) {
      $select.before(
        $("<label/>")
          .attr("for", namespace_i)
          .addClass(namespace + '_label ' + namespace_i + '_label')
          .append(settings.label)
      );
    }

  }

});

};
})(jQuery, this, 0);



jQuery(function () {
 "use strict";
 jQuery("#primary_navigation").tinyNav();
});