"Timeline Style Testimonial"
Bootstrap 3.3.0 Snippet by abhimanyusankhyan4

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
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.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 ---------->
<!--By kapil Verma(#kapilcreationz) and Abhimanyu Sankhyan-->
<link rel='stylesheet' id='bootstrap.min-css' href='http://ask.marketing/wp-content/themes/askmarketing/css/bootstrap.min.css?ver=3.4.1' type='text/css' media='all' />
<section id="home-test">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="testimonila-wrap">
<div class="media pull-left">
<div class="media-body">
<p>ask marketing is excellent to work with. not only do they create well composed media but they are full of ideas about what to do once you begin producing.”</p>
</div>
<div class="media-right">
<div class="img-wrap">
<img class="" src="http://ask.marketing/wp-content/uploads/2017/08/testi.png" alt="Generic placeholder image">
</div>
<div class="text-wrap text-left">
<strong>John Doe</strong>
<p>The Blogger Owner</p>
</div>
</div>
</div>
<div class="media pull-right">
<div class="media-left">
<div class="img-wrap pull-right">
<img class="" src="http://ask.marketing/wp-content/uploads/2017/08/testi.png" alt="Generic placeholder image">
</div>
<div class="text-wrap pull-right text-right">
<strong>John Doe</strong>
<p>The Blogger Owner</p>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
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
30
31
32
33
34
35
36
37
#home-test {
padding: 4% 0;
}
#home-test .media {
width: 85%;
margin-top: 30px;
}
#home-test .media:first-child {
margin-top: 0;
}
#home-test .media .media-left {
width: 34%;
}
#home-test .media .media-right {
width: 36%;
}
#home-test .media .img-wrap {
width: 100px;
float: left;
height: 100px;
border-radius: 50%;
overflow: hidden;
}
#home-test .media .img-wrap img {
width: 100%;
height: auto;
}
#home-test .media .text-wrap {
float: left;
width: auto;
padding: 30px 10px;
}
#home-test .media .text-wrap strong {
font: 700 15px/21px open sans;
text-transform: uppercase;
margin: 0;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: