<title>Bootstrap 4 Cards Layout Grid Columns with Equal Height</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.min.js" crossorigin="anonymous"></script>
<div class="row row-cols-1 row-cols-sm-2">
<img src="https://tutorialdeep.com/images/user2.jpg" class="card-img" alt="">
<h5 class="card-title">Card Title</h5>
<p class="card-text">This is the text content within card.</p>
<img src="https://tutorialdeep.com/images/user2.jpg" class="card-img" alt="">
<h5 class="card-title">Card Title</h5>
<p class="card-text">This is the text content within card. This is the text content within card. This is the text content within card. This is the text content within card. This is the text content within card.</p>