Bootstrap：列水平堆疊

Question

我在嵌套行內使用3列。 而不是水平堆疊，列是垂直堆疊。 這是我的代碼。 我嘗試過stackoverflow答案，但無法正常工作。

  <div class="jumbotron mainBar">
      <div class="container mainBarContainer">
          <div class="row">
              <div class="col-xs-2">
                 <div class=" profilePic">
                  <a href="#section_1"><h2>1<small>st</small><p>Title</p></h2></a>
                 </div>

                </div>
              <div class="col-xs-4">
                 <h1>Hello, world!</h1>

              </div>
              <div class="col-xs-6 container">
                <div class="row">
                 <div clas="col-xs-4">
                  <div class=" profilePic1">
                   <a href="#section_1"><h2>1<small>st</small><p>Title</p></h2></a>
                  </div>
                 </div>
                 <div clas="col-xs-4">
                  <div class=" profilePic1">
                   <a href="#section_1"><h2>1<small>st</small><p>Title</p></h2></a>
                  </div>
                 </div>
                 <div clas="col-xs-4">
                  <div class=" profilePic1">
                   <a href="#section_1"><h2>1<small>st</small><p>Title</p></h2></a>
                  </div>
                 </div>
                </div>

              </div>
         </div>
      </div>
    </div>

這里是小提琴fiidle

Answer 1

你有一個令人毛骨悚然的錯誤。 將clas更改為第二個容器內的class 。

演示