"Testimonial listing"
Bootstrap 3.2.0 Snippet by rohankacha

<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <div class="col-md-12"> <div class="testiminial-block"> <div class="row"> <div class="col-md-2 col-sm-2"><img src="http://placehold.it/430x520&text=Author Image!" class="img-responsive img-circle"/></div> <div class="col-md-8 col-sm-8 testimonial-content"> <h3>Lorem Ipsum is simply dummy text</h3> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p> <div class="testimonial-author"> Author Name <span>(Author Designation)</span> </div> </div> <div class="col-md-2 col-sm-2 comp-logo"> <img src="http://placehold.it/300x180&text=Author Company Logo!" class="img-responsive"/> </div> </div> </div> <div class="testiminial-block"> <div class="row"> <div class="col-md-2 col-sm-2 comp-logo"><img src="http://placehold.it/300x180&text=Author Company Logo!" class="img-responsive"/></div> <div class="col-md-8 col-sm-8 testimonial-content"> <h3>Lorem Ipsum is simply dummy text</h3> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p> <div class="testimonial-author"> Author Name <span>(Author Designation)</span> </div> </div> <div class="col-md-2 col-sm-2"> <img src="http://placehold.it/430x520&text=Author Image!" class="img-responsive img-circle"/> </div> </div> </div> <div class="testiminial-block"> <div class="row"> <div class="col-md-2 col-sm-2"><img src="http://placehold.it/430x520&text=Author Image!" class="img-responsive img-circle"/></div> <div class="col-md-8 col-sm-8 testimonial-content"> <h3>Lorem Ipsum is simply dummy text</h3> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p> <div class="testimonial-author"> Author Name <span>(Author Designation)</span> </div> </div> <div class="col-md-2 col-sm-2 comp-logo"> <img src="http://placehold.it/300x180&text=Author Company Logo!" class="img-responsive"/> </div> </div> </div> </div> </div> </div>
.testiminial-block{padding: 10px 0 30px; border-bottom:1px solid #ccc; dispaly:block; margin:0 0 20px;} .testimonial-content h3{margin-top:0px; color:#444;} .testimonial-content p{color:#777;} .testimonial-author{font-size:12px; font-style:italic; color:#999;} .comp-logo{padding-top:40px;} @media (max-width: 767px) { .testimonial-content{margin:20px 0;} .comp-logo{padding-top:0px;} }

Related: See More


Questions / Comments: