JSFiddle - React, Tailwind, and code Playground
by Shin Okada
HTML
<div id="frontcontent" class="center-block rows">
<div class='front-box'>
<img class='' src='http://placehold.it/56x73'>
<div class='box-header'>
Medlemskap
</div>
<div class='box-cont'>
Cectetur adipiscing elit. Quisque finibus dui in metus egestas pharetra. Ut et est eu nisl dignissim.
</div>
</div>
<div class='front-box'>
<img class='' src='http://placehold.it/56x73'>
<div class='box-header'>
Vi tilbyr
</div>
<div class='box-cont'>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque finibus dui in metus egestas pharetra. Ut et est eu nisl dignissim. at eget est. Praesent vulputate odio eu cursus faucibus.
</div>
</div>
<div class='front-box'>
<img class='' src='http://placehold.it/56x73'>
<div class='box-header'>
Bli Aktiv
</div>
<div class='box-cont'>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque finibus dui in metus egestas pharetra. Ut et est eu nisl dignissim.
</div>
</div>
</div>
CSS
#frontcontent{
margin: 70px auto 0;
text-align: center;
}
.front-box{
vertical-align: top;
width: 190px;
height: 328px;
padding: 13px auto 21px;
border: 3px solid gray;
border-radius: 12px;
margin: 8px;
text-align: center;
background-color: #fff;
opacity: 0.85;
display: inline-block;
}
.front-box img{
width: 56px;
height: 73px;
margin: 13px auto 17px;
}