引導3 - 按鈕，文本，與浮動按鈕

Question

我想做出這樣的佈局：

如何使用引導3我實現嗎？

試過下面的代碼，但它不工作：

<div class="container"> 
    <div class="well"> 
     <div class="col-md-3 text-center"><button class="btn btn-default">Previous</button></div> 
     <div class="col-md-6 text-center">title</div> 
     <div class="col-md-3 text-center"><button class="btn btn-default">Next</button></div> 
    </div> 
</div> 

Answer 1

必須使用.pull-right類和.pull-left與您的代碼，作爲一個例子：

<button class="btn btn-default pull-left">Previous</button> 
<button class="btn btn-default pull-right">Next</button> 

希望這給予你的想法和爲你工作。

Answer 2

，如果你換一個row內的cols它應該工作..

<div class="container"> 
    <div class="well"> 
    <div class="row"> 
     <div class="col-md-3 text-center"><button class="btn btn-default">Previous</button></div> 
     <div class="col-md-6 text-center">title</div> 
     <div class="col-md-3 text-center"><button class="btn btn-default">Next</button></div> 
    </div> 
    </div> 
</div> 

演示http://bootply.com/105224

Answer 3

引導包括一個反應靈敏，移動第一流體網格，適當擴展到12列作爲系統預設的網格類如.row和.col-md-4可用於快速製作網格佈局。

<div class="titleBar"> 
    <div class="row"> 
     <div class="col-md-3"><button class="btn btn-primary">Button 1</button></div> 
     <div class="col-md-6 text-center">Title Text</div> 
     <div class="col-md-3 "><button class="btn btn-primary">Button 2</button></div> 
    </div> 
    </div> 

希望這將是helpful.Also檢查這個http://getbootstrap.com/css/#grid約響應網格佈局的更多細節。