"product page"
Bootstrap 3.3.0 Snippet by jeevan123456

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.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 ----------> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous"> <div class="container"> <div class="row"> <div class="col-md-12"> <div class="product-title"> <h3>Ford Endeavour Top Class 2012</h3> <h5><i class="fa fa-map-marker"></i> Karali, Mahendru, New Delhi-110085</h5> <hr> </div> </div> </div> <div class="row"> <div class="col-md-8"> <div id="myCarousel" class="carousel slide" data-interval="false"> <!-- Indicators --> <ol class="carousel-indicators"> <li data-target="#myCarousel" data-slide-to="0" class="active"></li> <li data-target="#myCarousel" data-slide-to="1"></li> <li data-target="#myCarousel" data-slide-to="2"></li> </ol> <div class="carousel-inner"> <div class="item active"> <img src="https://static.pexels.com/photos/21787/pexels-photo.jpg" style="width:100%" class="img-responsive"> </div> <div class="item"> <img src="https://images.pexels.com/photos/458917/pexels-photo-458917.jpeg?w=940&h=650&auto=compress&cs=tinysrgb" class="img-responsive"> </div> <div class="item"> <img src="https://images.pexels.com/photos/130879/pexels-photo-130879.jpeg?w=940&h=650&auto=compress&cs=tinysrgb" class="img-responsive"> </div> </div> <!-- Controls --> <a class="left carousel-control" href="#myCarousel" data-slide="prev"> <span class="icon-prev"></span> </a> <a class="right carousel-control" href="#myCarousel" data-slide="next"> <span class="icon-next"></span> </a> </div> </div> <div class="col-md-4"> <div class="product-widget "> <ul class="list-group"> <li class="list-group-item"> <span class="badge">1 Day </span> Auction Ends in</li> <li class="list-group-item"> <span class="badge">2012</span> Manufacture Year </li> <li class="list-group-item"> <span class="badge">Diesel </span> Fuel Type </li> <li class="list-group-item"> <span class="badge">N/A</span>Permit</li> <li class="list-group-item"> <span class="badge">One</span>Owner</li> <li class="list-group-item"> <span class="badge">Silver</span> Color </li> <li class="list-group-item"> <span class="badge">No</span> Superdari </li> <li class="list-group-item"> <span class="badge">Yes, Available</span>RC Status</li> <li class="list-group-item"> <span class="badge">N/A</span> Tax Validity</li> <li class="list-group-item"> <span class="badge">N/A</span>Fitness Validity </li> <li class="list-group-item"> <span class="badge">N/A</span>Permit Validity </li> </ul> </div> <div class="product-auction-form"> <form class="form-inline" action="/action_page.php"> <div class="radiobtn"> <label class="radio-inline"> <input type="radio" name="optradio">With RC </label> </div> <div class="form-group"> <input id="" name="" type="text" placeholder="Amount" class="form-control input-md" required=""> </div> <button type="submit" class="btn btn-danger">BID NOW</button> </form> </div> </div> </div> <hr> </div> <div class="container product-detail-area"> <div class="row"> <div class="col-md-8"> <div class="panel-group" id="accordion"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse1"> Complete Description</a> </h4> </div> <div id="collapse1" class="panel-collapse collapse in"> <div class="panel-body"> <ul> <li>No body parts have been repaired</li> <li>Buyer needs to deposit money within 4 days</li> <li>Buyer is advised to inspect the vehicle physically</li> <li>Gaadiexpert is not responsible for any kinds of parts damaged or missing.</li> <li>Gaadiexpert with assist you in their limits.</li> </ul> </div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse2"> My Bid Details</a> </h4> </div> <div id="collapse2" class="panel-collapse collapse"> <div class="panel-body"> <table class="table table-hover"> <thead> <tr> <th>Bid Date & Time</th> <th>Bid Amount</th> <th>Status</th> </tr> </thead> <tbody> <tr> <td>25/01/2018</td> <td>260000</td> <td>Winning</td> </tr> <tr> <td>25/01/2018</td> <td>260000</td> <td>Winning</td> </tr> <tr> <td>25/01/2018</td> <td>260000</td> <td>Winning</td> </tr> </tbody> </table> </div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse3"> Must Know Info</a> </h4> </div> <div id="collapse3" class="panel-collapse collapse"> <div class="panel-body"> <ul> <li>No body parts have been repaired</li> <li>Buyer needs to deposit money within 4 days</li> <li>Buyer is advised to inspect the vehicle physically</li> <li>Gaadiexpert is not responsible for any kinds of parts damaged or missing.</li> <li>Gaadiexpert with assist you in their limits.</li> </ul> </div> </div> </div> </div> </div> <div class="col-md-4"> <h4>Customer Service : 011-45063800</h4> </div> </div> </div>
.carousel-inner .item img {border-radius: 0px 0px 0 0;max-height:480px;overflow: hidden;}

Related: See More


Questions / Comments: