"Client view"
Bootstrap 4.1.1 Snippet by saikrishna99666

<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 id="clients" class="section-bg"> <div class="container"> <div class="section-header"> <h3>Our </h3> <p>Meet our happy clients</p> </div> <div class="row no-gutters clients-wrap clearfix wow fadeInUp" style="visibility: visible; animation-name: fadeInUp;"> <div class="col-lg-3 col-md-4 col-xs-6"> <div class="client-logo"> <img src="https://res.cloudinary.com/dxfq3iotg/image/upload/v1559460149/abof.png" class="img-fluid" alt=""> </div> </div> <div class="col-lg-3 col-md-4 col-xs-6"> <div class="client-logo"> <img src="https://res.cloudinary.com/dxfq3iotg/image/upload/v1559460224/cropped-cropped-20170720-lucuLogo-squ2-e1500543540803.png" class="img-fluid" alt=""> </div> </div> <div class="col-lg-3 col-md-4 col-xs-6"> <div class="client-logo"> <img src="https://res.cloudinary.com/dxfq3iotg/image/upload/v1559460269/104840a62d46c05d285762857fecb61a.png" class="img-fluid" alt=""> </div> </div> <div class="col-lg-3 col-md-4 col-xs-6"> <div class="client-logo"> <img src="https://res.cloudinary.com/dxfq3iotg/image/upload/v1559460358/client-4.png" class="img-fluid" alt=""> </div> </div> <div class="col-lg-3 col-md-4 col-xs-6"> <div class="client-logo"> <img src="https://res.cloudinary.com/dxfq3iotg/image/upload/v1559460379/client-5.png" class="img-fluid" alt=""> </div> </div> <div class="col-lg-3 col-md-4 col-xs-6"> <div class="client-logo"> <img src="https://res.cloudinary.com/dxfq3iotg/image/upload/v1559460398/client-6.png" class="img-fluid" alt=""> </div> </div> <div class="col-lg-3 col-md-4 col-xs-6"> <div class="client-logo"> <img src="https://res.cloudinary.com/dxfq3iotg/image/upload/v1559460418/client-7.png" class="img-fluid" alt=""> </div> </div> <div class="col-lg-3 col-md-4 col-xs-6"> <div class="client-logo"> <img src="https://res.cloudinary.com/dxfq3iotg/image/upload/v1559460418/client-7.png" class="img-fluid" alt=""> </div> </div> </div> </div> </section>
.section-header h3 { font-size: 36px; color: #283d50; text-align: center; font-weight: 500; position: relative } .section-header p { text-align: center; margin: auto; font-size: 15px; padding-bottom: 60px; color: #556877; width: 50% } #clients { padding: 60px 0 } #clients .clients-wrap { border-top: 1px solid #d6eaff; border-left: 1px solid #d6eaff; margin-bottom: 30px } #clients .client-logo { padding: 64px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; border-right: 1px solid #d6eaff; border-bottom: 1px solid #d6eaff; overflow: hidden; background: #fff; height: 160px } #clients img { transition: all 0.4s ease-in-out }

Related: See More


Questions / Comments: