Bootstrap4 card d
HTML
<script src="https://code.jquery.com/jquery-3.4.1.slim.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row mb-2">
<div class="col-md-6 d-flex align-items-stretch">
<div class="card mb-4 shadow bg-white rounded">
<div class="card-body">
<div class="row pb-0">
<div class="col-9">
<strong class="mb-2 text-secondary"">Name A</strong>
</div>
<div class="col-3">
<img class="mb-2 rounded-circle float-right" src="" style="max-width:30px; height:auto;" alt="">
</div>
</div>
<h3 class="card-title mb-0">
<a target="_blank" rel="noopener noreferrer" class="text-dark" href="">Article 1 Title</a>
</h3>
<div class="mb-1 text-muted date">2020-01-01</div>
<p class="card-text mb-auto blog-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu sem integer vitae justo eget magna fermentum. Ultricies lacus sed turpis tincidunt id aliquet risus feugiat in. Eget felis eget nunc lobortis mattis aliquam faucibus.</p>
<div class="d-flex flex-row mt-0 ml-0 pl-0 ">
<!-- <span class="flaticon-clapping-2" data-toggle="tooltip" data-placement="top"...