"box shadoww"
Bootstrap 4.0.0 Snippet by muhamed122

<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="image one"> <img src="file:///C:/Users/MOHAMED/Downloads/Anc-Real-estate/img/project1.jpg"> <div class="item-state-top"> <div class="item-state">Completed</div> </div> <h3>Sycamore Hybird Offering</h3> <p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Donec sollicitudin molestie malesuada.</p> <div class="col-md-4 date"> <h5>City</h5> <h6>Doha</h6> </div> <div class="col-md-4 date"> <h5>City</h5> <h6>Doha</h6> </div> <div class="col-md-4 date"> <h5>City</h5> <h6>Doha</h6> </div> </div>
.image.one { margin-top: 30px; padding: 10px; margin-bottom: 30px; overflow: hidden; background-color: #FFFFFF; box-shadow: 0 6px 30px 0 rgba(0,0,0,0.04); display: block; width: 100%; border-radius: 3px; position: relative; text-align: left; } .image.one p { color: rgba(16,66,110,0.74); font-size: 15px; line-height: 26px; text-align: center; } .image.one h3 { color: #10426E; font-weight: bold; text-align: center; } .col-md-4.date h6 { margin-top: 20px; color: #10426E; font-size: 16px; font-weight: bold; text-align: center; margin-left: 13px; } .col-md-4.date h5 { color: rgba(16,66,110,0.74); font-size: 16px; text-align: center; margin-left: 11px; } .image.one img { width: 100%; height: 274px; border-radius: 2px; }

Related: See More


Questions / Comments: