引導網格布局

Question

我的CSS沒有選擇我的不同專欄。 它們彼此堆疊。 我希望它們每個都跨越同一行的4列。

<div class="container">
 <div class="row">

  <div class="col-md-4" id="directionsPanel1">
    <h3 class="directions-discription" id="directions-info1"></h3>
  </div>

  <div class="col-md-4" id="directionsPanel2">
    <h3 class="directions-discription" id="directions-info2"></h3>
  </div>

  <div class="col-md-4" id="directionsPanel3">
    <h3 class="directions-discription" id="directions-info3"></h3>
  </div>

Answer 1

如何使用浮點數呢？ 您可以將左上角輔助類的float應用於div.col-md-4，然后它們將不會彼此堆疊。

更新了JS小提琴，但您不必在CSS中向左浮動，無法讓JS小提琴來啟動引導程序。 http://jsfiddle.net/4xEPr/7/

    <div class="container">
 <div class="row">

  <div class="col-md-4 pull-left" id="directionsPanel1">
    <h3 class="directions-discription" id="directions-info1"></h3>
  </div>

  <div class="col-md-4 pull-left" id="directionsPanel2">
    <h3 class="directions-discription" id="directions-info2"></h3>
  </div>

  <div class="col-md-4 pull-left" id="directionsPanel3">
    <h3 class="directions-discription" id="directions-info3"></h3>
  </div>

和CSS

    div.col-md-4 {
    border: 1px solid #333;
    width: 200px;
    background-color: red;;

}