Tailwind cards of same height across multiple rows-CodePudding

I have a grid of cards for service requests. I have not been able to get all cards to simply have the same height. It works fine for the row the largest item is at but the next row height is smaller. How do I have them all the same height?

Code:

https://play.tailwindcss.com/ACR2zkFOeb

CodePudding user response：

Switch auto-rows-max with auto-rows-fr. You can read more about the fr unit here. Here's a StackOverflow answer about a similar scenario with a comprehensive explanation of why it works: link. auto-rows-fr is the same as grid-auto-rows: 1fr as you can see in the documentation.

Tailwind-play with a working example.

CodePudding user response：

Have you tried this?

<div >
  <div ></div>
  <div ></div>
  <div ></div>
</div>