無法在標頭中正確顯示引導程序搜索欄

Question

我在顯示標題右側的搜索欄時遇到問題。

我在做什麼是以下幾點：

<div class="row"> 
    <div class="col-lg-12"> 
     <div class="page-header"> 
      <div class='btn-toolbar pull-right'> 
       <div class='btn-group'> 
        <button type="submit" class="btn btn-default">Submit</button> 
        <input type="text" class="form-control" placeholder="Search"> 

       </div> 
      </div> 
      <h2>Perfiles</h2> 
     </div> 
    </div> 
</div> 

這裏有一個小提琴來說明我的問題：

https://jsfiddle.net/DTcHh/16632/

編輯：

好吧，這裏用的圖片問題：

我想要的是，sarch按鈕和輸入都在同一行。

Answer 1

您搜索的輸入字段爲width: 100%和display:block。解決這個問題應該可以解決問題。嘗試添加以下到您的CSS：

.form-control { 
    width: auto; 
    display:inline-block; 
} 

Fiddle。

Answer 2

得到它的工作！

訣竅是在利用class="form-inline"

下面是代碼，使其工作：

<div class="row"> 
<div class="col-lg-12"> 
    <div class="page-header"> 
     <div class='btn-toolbar pull-right'> 
      <div class='btn-group'> 
       <button type="submit" class="btn btn-default">Submit</button> 
       <input type="text" class="form-control" placeholder="Search"> 

      </div> 
     </div> 
     <h2>Perfiles</h2> 
    </div> 
</div> 

，這裏是什麼，我其實是在尋找圖片：