Bootstrap搜索表單佈局

Question

我無法使Bootstrap呈現右對齊按鈕的簡單全寬搜索輸入。這裏是我的代碼：

<div class="row"> 
    <div class="col-md-12"> 
     <form class="form-inline"> 
      <input type="search" class="form-control" id="search" placeholder="I wish this would work..."> 
      <button type="button" class="btn btn-primary">Search</button> 
     </form> 
    </div> 
</div> 

所有這一切都包裹在container。

Answer 1

你可以嘗試這樣的：

<div class="container"> 
    <form class="form-inline row"> 
    <div class="col-xs-8"> 
     <input type="search" class="form-control" id="search" placeholder="I wish this would work..."> 
    </div> 
    <div class="col-xs-4"> 
     <button type="button" class="btn btn-primary btn-block">Search</button> 
    </div> 
    </form> 
</div> 

這是一個完整的例子：https://jsfiddle.net/v8rm9nx4/3/

Answer 2

添加pull-right到類的字符串

class="btn btn-primary pull-right"