<script src="https://cdn.tailwindcss.com"></script>

<div class="h-auto grid gap-4 grid-cols-3 p-4">
  <div class="bg-yellow-200 flex flex-col p-4 justify-between gap-4 min-w-[100px]">
    <h3 class="text-xl font-bold">Title - Card 1</h3>
    <p contenteditable>Medium length description with a few more words here.</p>
    <div class="h-[100px] w-full bg-pink-200 "></div>
  </div>
  <div class="bg-yellow-200 flex flex-col p-4 justify-between gap-4">
    <h3 class="text-xl font-bold">Title - Card 2</h3>
    <p contenteditable>Long Description. Lorem ipsum dolor sit, amet consectetur adipisicing elit.</p>
    <div class="h-[100px] w-full  bg-blue-200"></div>
  </div>
  <div class="bg-yellow-200 flex flex-col p-4 justify-between gap-4">
    <h3 class="text-xl font-bold">Title - Card 3</h3>
    <p contenteditable>Short Description.</p>
    <div class="h-[100px] w-full  bg-green-200"></div>
  </div>
</div>