"Price Cards Table"
Bootstrap 4.1.1 Snippet by StudyShhot

<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="price-widgets text-center" > <div class="row"> <div class="col-lg-3 card-one"> <div class="card text-white bg-dark mb-3" style="" > <img src=" https://studyshoot.com/wp-content/uploads/2020/05/code_dribbble.gif"> <div class="card-body"> <div class="card-top "> Website Design </div> <p class="card-text"> 2500$ </p> <a class="btn btn-danger btn-block" href=" ">Book Now </a> </div> </div> </div> <div class="col-lg-3 card-two"> <div class="card text-white bg-dark mb-3" > <img src=" https://studyshoot.com/wp-content/uploads/2020/05/intropic.gif"> <div class="card-body"> <div class="card-top ">Fotography </div> <p class="card-text"> 500$ </p> <a class="btn btn-danger btn-block" href=" "> Book Now </a> </div> </div> </div> <div class="col-lg-3 card-three"> <div class="card text-white bg-dark mb-3" > <img src="https://studyshoot.com/wp-content/uploads/2020/05/9901bcb36b99e3e91c70e91fb06f17ed.gif "> <div class="card-body"> <div class="card-top ">Control </div> <p class="card-text">2100$ </p> <a class="btn btn-danger btn-block" href=" "> Book Now </a> </div> </div> </div> <div class="col-lg-3 card-four"> <div class="card text-white bg-dark mb-3" > <img src="https://studyshoot.com/wp-content/uploads/2020/05/camera.gif "> <div class="card-body"> <div class="card-top ">Control </div> <p class="card-text">2100$ </p> <a class="btn btn-danger btn-block" href=" "> Book Now </a> </div> </div> </div> </div> </div>
.price-widgets img{ height: 130px; margin-top: -90px; width: 30%; position: relative; left: 25%; border-radius: 450px; } .price-widgets { display: flex; justify-content: center; align-items: center; padding-top:150px; position: relative; left: 0% }

Related: See More


Questions / Comments: