"Testimonial listing"
Bootstrap 3.2.0 Snippet by DiTso

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<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 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>
</div>
</div>
</div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
.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;}
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: