bootstrap上的全寬輸入組3.1.0 navbar

Question

我在bootstrap v3.1.0中遇到了一些麻煩。 （v3.0.3）：http://bootply.com/109727 但是，感覺像輸入組有一些麻煩，我越來越（v3.1.0）：http://bootply.com/109728 任何想法如何解決這個問題？還是有另一種方法來獲得相同的結果？

<form class="navbar-form"> 
    <div class="form-group" style="display:inline;"> 
     <div class="input-group"> 
      <input class="form-control" type="text"> 
      <span class="input-group-addon"><span class="glyphicon glyphicon-search"></span></span> 
     </div> 
    </div> 
</form> 

Answer 1

這個問題上.navbar-form .form-control的width:auto。您可以width: 100%通過.FORM列直插式覆蓋這一點，它應該工作...

從3.1文檔...

由於擡起頭，.navbar形式的股了它的代碼混入。某些表單控件（如輸入組）可能需要固定寬度才能在導航欄中正確顯示。

引導3.1

.navbar-form .form-control { 
    display: inline-block; 
    width: auto; /*This is the issue*/ 
    vertical-align: middle; 
} 

引導3.0.3

.navbar-form .form-control { 
    display: inline-block; 
} 

Answer 2

對於引導3.3.6，我解決它使用：

.navbar-form .input-group .input-group-btn { 
    width: 1%; 
}