如何使Bootstrap标题项和下拉菜单的宽度相同?

问题描述:

我在我的引导模板这个头:如何使Bootstrap标题项和下拉菜单的宽度相同?

<nav class="navbar navbar-default navbar-fixed-top"> 
    <div class="container"> 
     <div class="navbar-header"> 
      //Some unrelated stuff 
     </div> 

     <div id="navbar" class="collapse navbar-collapse"> 
      <ul class="nav navbar-nav"> 
       //Some unrelated stuff   
      </ul> 

      <ul class="nav navbar-nav pull-right-custom"> 
       <li class="dropdown"> 
        <a href="" class="dropdown-toggle" data-toggle="dropdown">DDButtonText <strong class="caret"></strong></a> 
        <ul class="dropdown-menu"> 
         Test 
        </ul> 
       </li> 
      </ul> 
     </div> 
    </div> 
</nav> 

我试图做到的是使下拉菜单相同的宽度为“DDButtonText”的事情。我尝试将最小宽度设置为下拉菜单,但对于每个浏览器都不相同。在我的Firefox中没问题,但Chrome浏览器和其他浏览器的尺寸略有不同。

不管浏览器如何让我的菜单与按钮大小相同?

+0

软硬度:0 0 50%;在他们每个人和显示:flex;在他们的容器上 –

您可以尝试添加此:

CSS

.nav .dropdown-menu{ 
    width: 100%; 
    min-width: inherit; 
} 

Bootplyhttp://www.bootply.com/MfkTjxasD7