"Sleek testimonial slider "
Bootstrap 4.1.1 Snippet by bootstraplily.com

<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 ----------> <div class="container"> <div class="row"> <div class="col-12"> <section class="tester_new text-center"> <h2 class="mt-5">What other say for us</h2> <hr> <h5 class="mb-5">Our team created best opportunities for your business.</h5> <div class="container"> <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators"> <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li> <li data-target="#carouselExampleIndicators" data-slide-to="1"></li> <li data-target="#carouselExampleIndicators" data-slide-to="2"></li> </ol> <div class="carousel-inner" role="listbox"> <div class="carousel-item active"> <div class="row"> <div class="col-lg-2"></div> <div class="col-lg-8"> <p>"The teaching, in my opinion, is the best that anyone can hope for. Sekolah High School staff provide an environment in which students are able to reach their full potential. As well as this. I felt constantly challenged to push myself to exceed what is expected. I have no doubt that the persion I become is due to my time spent here and that the last six years have been the best of my life."</p> <hr> <h5>Cynthia Nelson</h5> <p>Student of scince</p> </div> <div class="col-lg-2"></div> </div> </div> <div class="carousel-item"> <div class="row"> <div class="col-lg-2"></div> <div class="col-lg-8"> <p>"The teaching, in my opinion, is the best that anyone can hope for. Sekolah High School staff provide an environment in which students are able to reach their full potential. As well as this. I felt constantly challenged to push myself to exceed what is expected. I have no doubt that the persion I become is due to my time spent here and that the last six years have been the best of my life."</p> <hr> <h5>Kevin Rich</h5> <p>Student of scince</p> </div> <div class="col-lg-2"></div> </div> </div> <div class="carousel-item"> <div class="row"> <div class="col-lg-2"></div> <div class="col-lg-8"> <p>"The teaching, in my opinion, is the best that anyone can hope for. Sekolah High School staff provide an environment in which students are able to reach their full potential. As well as this. I felt constantly challenged to push myself to exceed what is expected. I have no doubt that the persion I become is due to my time spent here and that the last six years have been the best of my life."</p> <hr> <h5>John Deo</h5> <p>Student of scince</p> </div> <div class="col-lg-2"></div> </div> </div> </div> </div> </div> </section> </div> </div> </div> <div class="container text-center small text-muted mt-4 mb-5"> Design by <a href="https://bootstraplily.com/" target="_blank">bootstraplily.com</a> </div>
.tester_new { padding: 20px 0 100px; } .tester_new hr { width: 100px; } .tester_new .carousel-item p { color: #666; line-height: 28px; letter-spacing: 1px; } .tester_new .carousel-item hr { width: 100px; } .tester_new .carousel-item h5 { font-weight: 700; margin-bottom: 0; } .tester_new .carousel-indicators li { height: 70px; width: 70px; border-radius: 50%; background-image: url(https://images.unsplash.com/photo-1586430921668-e095e5243daf?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=675&q=80); background-position: center; background-size: cover; border: 5px solid #f1f2f3; opacity: 0.4; box-shadow: 0px 0px 5px 1px #ccc; margin: 0 10px; cursor:pointer; } .tester_new .carousel-indicators li:nth-child(2) { background-image: url(https://images.unsplash.com/photo-1529284607059-de6f2f0e661f?ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80); } .tester_new .carousel-indicators li:nth-child(3) { background-image: url(https://images.unsplash.com/photo-1531891570158-e71b35a485bc?ixlib=rb-1.2.1&auto=format&fit=crop&w=700&q=80); } .carousel-indicators { bottom: -90px; } .tester_new .carousel-indicators .active { opacity: 1; }

Related: See More


Questions / Comments: