"Testmonial Design"
Bootstrap 4.1.1 Snippet by Shivamsemisetia

<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="testimonials"> <div class="container"> <div class="section-title text-center"> <h4 class="yellowtail-font orange-text">Testimonials</h4> <h2>Clients Review</h2> </div> <div class="row mt-3rem"> <div class="col-md-4"> <div class="test-box" style="width: 100%; display: inline-block;"> <div class="test-box-inner"> <div class="test-box-white"> <div class="g-logo"> <img src="https://develop.stackblue.com/phillystronghauling/wp-content/uploads/2023/03/google-logo-icon.png" alt=""> </div> <ul class="rating-star"> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> </ul> <p>They always have the best flavor pizzas and always fresh and they warm it to perfection. The service is quick and the guys that work there bring a smile to your face , very pleasant atmosphere. The place is beyond clean and besides take out its very relaxing to be able to sit and enjoy a meal there.</p> </div> <h5>-Jessica Rivera</h5> </div> </div> </div> <div class="col-md-4"> <div class="test-box" style="width: 100%; display: inline-block;"> <div class="test-box-inner"> <div class="test-box-white"> <div class="g-logo"> <img src="https://develop.stackblue.com/phillystronghauling/wp-content/uploads/2023/03/google-logo-icon.png" alt=""> </div> <ul class="rating-star"> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> </ul> <p>Great local pizzeria and restaurant conveniently located in the heart of West Babylon. Terrific variety of specialty slices and they have reasonably priced specials. I would recommend calling ahead for pizza pies as this is a very busy place. Their website gives great insight into the menus. I would highly recommend this place. Grandma Pie was especially good.</p> </div> <h5>-David Cohen</h5> </div> </div> </div> <div class="col-md-4"> <div class="test-box" style="width: 100%; display: inline-block;"> <div class="test-box-inner"> <div class="test-box-white"> <div class="g-logo"> <img src="https://develop.stackblue.com/phillystronghauling/wp-content/uploads/2023/03/google-logo-icon.png" alt=""> </div> <ul class="rating-star"> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> <li><i class="fa-solid fa-star"></i></li> </ul> <p>This was the first time I ordered from Brunello's. Their cheese pie is hands-down the best pie I have had in the Babylon/Bay Shore/Islip area and possibly the second best Neopolitan slice on the Island (Little Vinnies is the best).</p> </div> <h5>-Joseph White</h5> </div> </div> </div> </div> </div> </section>
.rating-star li { margin-right: 4px; color: gold; } .test-box-white{ padding: 20px; border: 1px solid #ededed!important; background-color: #fafafa!important; position: relative; margin-bottom: 20px } .g-logo{ position: absolute; right: 20px; top: 20px; width: 30px; } .test-box-inner{ position: relative; } .test-box-inner::before { content: ""; height: 90px; left: 10px; top: 24px; width: 24px; background: url(https://develop.stackblue.com/phillystronghauling/wp-content/uploads/2023/03/quotes-img.png) 0 0 no-repeat; background-size: 100%; position: absolute; z-index: 99; } .test-box-white:after, .test-box-white:before { top: 100%; left: 30px; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; } .test-box-white:after { border-color: rgba(250, 250, 250, 0); border-top-color: #fafafa; border-width: 10px; margin-left: -10px; } .test-box-white{ padding-left: 45px; } .test-box-white:before { border-color: rgba(237, 237, 237, 0); border-top-color: #ededed; border-width: 12px; margin-left: -12px; } .test-box p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; color: #000; } .test-box { padding: 0 15px; } .rating-star { display: flex; flex-wrap: wrap; margin-bottom: 15px; } .testimonials-sec{ padding: 90px 0; }

Related: See More


Questions / Comments: