引導獨立滾動3個柱設計

Question

我有類似answers.yahoo.com 3柱設計，我需要添加類似的滾動功能，我試過，但它不工作由於某種原因

小提琴：fiddle.jshell.net/DTcHh/5821/

<div class="container"> 
    <div class="row"> 
     <div class="col-md-8 col-md-push-2" style="padding:0 5px!important;"> 
      <div class="c-scroll" style="background-color:#333; width:100%; min-height:200px; margin-bottom:10px;"> 
       <p>This is category bar</p> 
       <p>Question 1</p> 
       <p>Question 2</p> 
       <p>Question 3</p> 
       <p>Question 4</p> 
       <p>Question 5</p> 
       <p>Question 6</p> 
       <p>Question 7</p> 
       <p>Question 8</p> 
       <p>Question 9</p> 
       <p>Question 10</p> 
       <p>Question 11</p> 
      </div> 
     </div> 
     <div class="col-md-2 col-md-pull-8" style="height:auto; padding:0 5px!important;"> 
      <div style="background-color:#333; width:100%; min-height:200px; margin-bottom:10px;"> 
       <p>Featured Question</p> 
      </div> 
      <div style="background-color:#333;width:100%; min-height:200px; margin-bottom:10px;"> 
       <p>Top Question</p> 
      </div> 
     </div> 
     <div class="col-md-2" style="min-height:200px; padding:0 5px!important;"> 
      <div style="background-color:#333; width:100%; min-height:200px; margin-bottom:10px;"> 
       <p>right column</p> 
      </div> 
     </div> 
    </div> 
</div> 

Answer 1

使用自舉列類SM或像MD小屏幕的xs：

<div class="container"> 
     <div class="row"> 
      <div class="col-md-8 col-sm-8 col-md-push-2 col-sm-push-2" style="padding:0 5px!important;"> 
       <div class="c-scroll" style="background-color:#333; width:100%; min-height:200px; margin-bottom:10px;"> 
        <p>This is category bar</p> 
        <p>Question 1</p> 
        <p>Question 2</p> 
        <p>Question 3</p> 
        <p>Question 4</p> 
        <p>Question 5</p> 
        <p>Question 6</p> 
        <p>Question 7</p> 
        <p>Question 8</p> 
        <p>Question 9</p> 
        <p>Question 10</p> 
        <p>Question 11</p> 
       </div> 
      </div> 
      <div class="col-md-2 col-sm-2 col-md-pull-8 col-sm-pull-8" style="height:auto; padding:0 5px!important;"> 
       <div style="background-color:#333; width:100%; min-height:200px; margin-bottom:10px;"> 
        <p>Featured Question</p> 
       </div> 
       <div style="background-color:#333;width:100%; min-height:200px; margin-bottom:10px;"> 
        <p>Top Question</p> 
       </div> 
      </div> 
      <div class="col-md-2 col-sm-2" style="min-height:200px; padding:0 5px!important;"> 
       <div style="background-color:#333; width:100%; min-height:200px; margin-bottom:10px;"> 
        <p>right column</p> 
       </div> 
      </div> 
     </div> 
    </div>