css - Facebook style friends sidebar bootstrap -


enter image description here

<div class="sidebar-nav-fixed">    <div class="row">       <div>          <a href="#" class="thumbnail">          <img src="images/geeks-thumbnail.jpeg">          </a>       </div>       <div>          <a href="#" class="thumbnail">          <img src="images/geeks-thumbnail.jpeg">          </a>       </div>       <div>          <a href="#" class="thumbnail">          <img src="images/geeks-thumbnail.jpeg">          </a>       </div>       <div>          <a href="#" class="thumbnail">          <img src="images/geeks-thumbnail.jpeg">          </a>       </div>       <div>          <a href="#" class="thumbnail">          <img src="images/geeks-thumbnail.jpeg">          </a>       </div>       <div>          <a href="#" class="thumbnail">          <img src="images/geeks-thumbnail.jpeg">          </a>       </div>    </div> </div> 

i want display these profile thumbnails 3 in each row inside sidebar. using thumbnail class in these coming 1 image on each line.

kindly help.

thanks

the number of items in row decided col- class (grid system docs)

for 3 items per row use col-**-4:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>    <div class="sidebar-nav-fixed">     <div class="row">        <div class="col-xs-4">           <a href="#" class="thumbnail">           <img src="http://placehold.it/150x150">           </a>        </div>        <div class="col-xs-4">           <a href="#" class="thumbnail">           <img src="http://placehold.it/150x150">           </a>        </div>        <div class="col-xs-4">           <a href="#" class="thumbnail">           <img src="http://placehold.it/150x150">           </a>        </div>        <div class="col-xs-4">           <a href="#" class="thumbnail">           <img src="http://placehold.it/150x150">           </a>        </div>        <div class="col-xs-4">           <a href="#" class="thumbnail">           <img src="http://placehold.it/150x150">           </a>        </div>        <div class="col-xs-4">           <a href="#" class="thumbnail">           <img src="http://placehold.it/150x150">           </a>        </div>     </div>  </div>


Comments