How do you make cards of equal height in Bootstrap?

<div class="row row-cols-1 row-cols-md-3 g-2">
  <div class="col"><div class="card h-100"><div class="card-body">Short text</div></div></div>
  <div class="col"><div class="card h-100"><div class="card-body">This card has more text, so it is taller, and the other cards become the same height.</div></div></div>
  <div class="col"><div class="card h-100"><div class="card-body">Short</div></div></div>
</div>

The preview is narrow, so the cards are stacked. On a wide screen they are in a row with the same height. See Cards.

• Previous Interview Question
• Next Interview Question

---

Tutorials
No Content Found.

Exercises & Assignments
No Content Found.

Interview Questions & Answers
No Content Found.