"Creative Testimonial Circle Slider"
Bootstrap 4.1.1 Snippet by koshikojha

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/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<section class="testimonial_area">
<h4>Testimonial</h4>
<h2>What Our core client say ?</h2>
<div class="carousel slide testimonial_slide carousel-fade" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<div class="testimonial_content">
<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="media">
<img src="http://themazine.com/html/kabbo/images/testimonial-1.jpg" alt="">
<div class="media-body">
<a href="#">Emran Khan</a>
<h6>Frontend Developer</h6>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="testimonial_content">
<p>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. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
<div class="media">
<img src="http://themazine.com/html/kabbo/images/testimonial-3.jpg" alt="">
<div class="media-body">
<a href="#">Jesi Azaira</a>
<h6>Creative Web Solution</h6>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="testimonial_content">
<p>It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.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>
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
.testimonial_area {
display: block;
overflow: hidden;
padding-left: 200px;
padding-top: 220px;
padding-bottom: 100px;
position: relative;
/* Jupitar Nave */
}
.testimonial_area h4 {
font: 700 18px/1 "Niramit", sans-serif;
color: #282331;
padding-bottom: 53px;
text-transform: uppercase;
}
.testimonial_area h2 {
font: 400 52px/62px "Niramit", sans-serif;
color: #282331;
padding-bottom: 70px;
}
.testimonial_area .testimonial_slide {
padding-left: 170px;
/* Control */
}
.testimonial_area .testimonial_slide .testimonial_content {
padding-left: 220px;
z-index: 1;
}
.testimonial_area .testimonial_slide .testimonial_content:before {
content: "\f102";
position: absolute;
left: 0;
top: 0;
color: #faf7ff;
font-size: 205px;
font-family: Flaticon;
font-style: normal;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: