如何使Firefox中的下拉菜单与Chrome/IE相同？

Question

所以，我正在建立一个带有下拉菜单的网站。在Chrome它看起来不错，但在Firefox它不需要填充，我想找到一种方法，使他们在这两个浏览器上看起来相同。

我知道这是一个已知的问题，但我没有找到一个体面的解决方案，我的问题。

下面是从下拉

守则图纸上调试

<div class="collapse navbar-collapse" id="MainMenu_nav"> 
    <ul class="navbar-nav nav h> 
     <li aria-haspopup="true" class="HasItems hover focus"> 
     <div class="Wrapper" tabindex="-1"> 
       .... 
      </div> 
     </li> 
    </ul> 
    </div> 

的CSS

.navbar-collapse{ 
    max-height:none; 
    margin-left:-10px; 
    margin-right:-10px; 
} 

.h{ 
    position:relative; 
    back-ground-color:black; 
    margin-left:5px; 
    white-space:nowrap; 
    width:100%; 
    display:table; 
} 

.h>li.hover{ 
    background-color:white; 
    top:3px 
} 
.h>li{ 
    position:Relative; 
    white-space:nowrap; 
    display:table-cell; 
    float:none; 
    vertical-align:middle 
} 

什么是适用于这里的伎俩？

Answer 1

有趣的是，我猜想这个问题可能与下拉菜单没有任何关系，但事实上firefox不知何故忽略了填充。 好像我错了，因为根据this answer，这是Chrome和Firefox的不是一个错误

我已经简单地显示li为块固定问题

@-moz-document url-prefix(){ 
    .h >li.hover{ 
     height:45px; 
     display:block; 
     top:3px; 
    } 
}