"testimonial "
Bootstrap 4.1.1 Snippet by dkstudio

<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="col-md-4 col-sm-6 col-xs-12"> <div class="item has-matchHeight" style="height: 246px;"> <div class="author"> <img src="https://acmap.travelerwp.com/wp-content/uploads/2019/01/Female-tourist-with-backpack-at-railway-station-300x300-70x70.jpg" alt="User Avatar"> <div class="author-meta"> <h4>Linda P</h4> <div class="star"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> </div> </div> </div> <p> Faucibus tristique felis potenti ultrices ornare rhoncus semper hac facilisi Rutrum tellus lorem sem velit nisi non pharetra in dui </p> </div> </div>
.item { border: 1px solid #D7DCE3; border-radius: 3px; padding: 30px; background: url(https://acmap.travelerwp.com/wp-content/themes/traveler/v2/images/qoute_icon.png) top 30px right 30px no-repeat; } .item .author { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 30px; } .item .author img { margin-right: 20px; width: 70px; height: auto; border-radius: 50%; } .st-testimonial-new .st-testimonial-slider .item .author .author-meta h4 { font-size: 16px; margin-bottom: 8px; } .item .author .author-meta .star .fa { color: #FFDC00; font-size: 16px; margin-right: 2px; } .item p { font-size: 14px; color: #768092; margin-bottom: 0px; }

Related: See More


Questions / Comments: