How to make nice white boxes with a shadow and no border?
Ever wondered how to make these slick modern cards using Bootstrap 4? They are the shit. For some reason they're not inside the Bootstrap docs though and I couldn't find this simple info anywhere else. So I decided to explain it here.
A horse walked into a bar. Several people got up and left as they spotted the potential danger in the situation.
This is the content of the box. Feel free to fill it up with anything.
<div class="card shadow-sm border-0"> <div class="card-body"> <h5>Header</h5> <p class="mb-0"> This is the content of the box.
Feel free to fill it up with anything. </p> </div> </div>
shadow-smto the card class.
If you want the cards to really shine, make sure the background color of your page is something other than white. I recommend Bootstrap's
All done. Of course, you might want to just modify your Bootstrap template so every card automatically has these classes applied to it. But that's up to you.