"1. recommended cars bs4"
Bootstrap 4.0.0 Snippet by jeevan123456

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/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="recommended-cars"> <div class="container"> <div class="row"> <div class="col-md-12"> <div class="card"> <div class="card-body"> <h5> Recommended used cars based on Price & Location</h5> <div class="row py-2"> <div class="col-md-4 vertical-box"> <div class="card"> <img class="card-img-top mh200-text" src="https://img2.gaadicdn.com/images/usedcarimages/320x224/11-2017/1843403/IMG_6603.jpg" alt="Card image"> <div class="card-body"> <h4 class="card-title mw30-text">2006 Toyota Innova 2.5 V Diesel 7-seater 2006 Toyota Innova 2.5 V Diesel 7-se</h4> <h5 class="card-text">Rs. 25.32 Lac*</h5> <ul class="list-inline"> <li class="list-inline-item">44,114 Km</li> <li class="list-inline-item">Petrol</li> <li class="list-inline-item">Gurugram</li> </ul> <button type="button" class="btn btn-outline-danger">Contact Sellers</button> </div> </div> </div> <div class="col-md-4 vertical-box"> <div class="card"> <img class="card-img-top mh200-text" src="https://img2.gaadicdn.com/images/usedcarimages/320x224/11-2017/1843403/IMG_6603.jpg" alt="Card image"> <div class="card-body"> <h4 class="card-title mw30-text">2006 Toyota Innova 2.5 V Diesel 7-seater 2006 Toyota Innova 2.5 V Diesel 7-se</h4> <h5 class="card-text">Rs. 25.32 Lac*</h5> <ul class="list-inline"> <li class="list-inline-item">44,114 Km</li> <li class="list-inline-item">Petrol</li> <li class="list-inline-item">Gurugram</li> </ul> <button type="button" class="btn btn-outline-danger">Contact Sellers</button> </div> </div> </div> <div class="col-md-4 vertical-box"> <div class="card"> <img class="card-img-top mh200-text" src="https://img2.gaadicdn.com/images/usedcarimages/320x224/11-2017/1843403/IMG_6603.jpg" alt="Card image"> <div class="card-body"> <h4 class="card-title mw30-text">2006 Toyota Innova 2.5 V Diesel 7-seater 2006 Toyota Innova 2.5 V Diesel 7-se</h4> <h5 class="card-text">Rs. 25.32 Lac*</h5> <ul class="list-inline"> <li class="list-inline-item">44,114 Km</li> <li class="list-inline-item">Petrol</li> <li class="list-inline-item">Gurugram</li> </ul> <button type="button" class="btn btn-outline-danger">Contact Sellers</button> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div>
.mw30-text {max-height: 30px; overflow: hidden;} .mh200-text { min-height: 200px; max-height:200px; overflow: hidden; }

Related: See More


Questions / Comments: