Полоса прокрутки не отображается на вкладке содержимого загрузочной бутстрага

Question

У меня есть правая панель, где она указана с вкладкой nav, и я хочу показать полосу прокрутки для содержимого табуляции, но ее не показывать. Я хочу загрузить динамические данные в первый navtab, но из-за полоса прокрутки не отображается, я не могу прокручивать.

.right-sidebar-wrapper #r-s-tab{ 
 
    overflow-y: auto; 
 
    height: 100%; 
 
    position:fixed; 
 
} 
 
.right-sidebar-wrapper #activity a, .right-sidebar-wrapper #locations a{ 
 
    padding-top: 8px; 
 
    border-radius: 3px; 
 
    display: block; 
 
} 
 
#activity a img, #locations a img { 
 
    height: 120px; 
 
    width: 100%; 
 
}

<div class="right-sidebar-wrapper"> 
 
    <div id="r-s-tab" class="tab-content"> 
 
     <div class="tab-pane fade active in" id="activity"> 
 
      <div class="col-lg-12"> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
       <a href="#"> 
 
        <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
       </a> 
 
      </div> 
 
     </div> 
 
    </div> 
 
    <div class="tab-pane fade" id="locations"> 
 
     <div class="col-lg-12"> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
      <a href="#"> 
 
       <img src="http://placehold.it/350x150" class="img-responsive img-rounded"> 
 
      </a> 
 
     </div> 
 
    </div> 
 
<div>

Answer 1

Вы пытаетесь это ....

.right-sidebar-wrapper{ 
    height: 100%; 
} 
.right-sidebar-wrapper #r-s-tab{ 
    position:fixed; 
} 
.right-sidebar-wrapper #r-s-tab{ 
    height: 200px; // Set this height to the appropriate size 
    overflow-y: scroll; // Only add scroll to vertical column 
}