如何使Bootstrap標題項和下拉菜單的寬度相同？

Question

我在我的引導模板這個頭：

<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瀏覽器和其他瀏覽器的尺寸略有不同。

不管瀏覽器如何讓我的菜單與按鈕大小相同？

Answer 1

您可以嘗試添加此：

CSS：

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

Bootply：http://www.bootply.com/MfkTjxasD7