Cards with Equal Height and Button

Spartus

Voluptatem eum nobis blanditiis eos laudantium cumque aliquid. Quibusdam incidunt architecto vel sunt alias. Reiciendis quisquam atque magnam. Quam aut ea sequi.

$77.50

Add to Cart

Argus Seventy-Five

Sunt autem quia ea quam tempora perspiciatis voluptate dolorem. Repellendus est fuga molestiae modi.

$39.99

Add to Cart

Kodak Instamatic 100

Pariatur perspiciatis doloribus deserunt sed eligendi veritatis corrupti. Inventore doloremque quia doloribus aliquid. Qui earum rerum eius ad qui.

$23.25

Add to Cart

<div class="w-full sm:flex flex-wrap -mx-2">

  <div class="flex items-stretch sm:w-1/2 md:w-1/3 px-2 mb-4">
    <div class="flex flex-col bg-gray-100 rounded-lg overflow-hidden">
      <div class="flex-grow">
        <img class="w-full" src="img/001.jpg" loading="lazy" alt="Spartus camera">
        <div class="px-6 py-4">
          <div class="text-lg font-nunito_bold">Spartus </div>
          <div class="text-sm font-nunito_light">
            Voluptatem eum nobis blanditiis eos laudantium cumque aliquid.
            Quibusdam incidunt architecto vel sunt alias. Reiciendis quisquam
            atque magnam. Quam aut ea sequi.
          </div>
          <div class="font-nunito_bold">$77.50</div>
        </div>
      </div>
      <div class="self-end w-3/5 font-nunito_bold text-gray-500 text-center 
        border border-gray-400 hover:bg-gray-400 hover:text-white p-1 mx-auto mb-4 
        rounded-lg cursor-pointer">
        Add to Cart
      </div>
    </div>
  </div>

  <div class="flex items-stretch sm:w-1/2 md:w-1/3 px-2 mb-4">
    <div class="flex flex-col bg-gray-100 rounded-lg overflow-hidden">
      <div class="flex-grow">
        <img class="w-full" src="img/002.jpg" loading="lazy" alt="Argus Seventy-Five camera">
        <div class="px-6 py-4">
          <div class="text-lg font-nunito_bold">Argus Seventy-Five</div>
          <div class="text-sm font-nunito_light">
            Sunt autem quia ea quam tempora perspiciatis voluptate dolorem.
            Repellendus est fuga molestiae modi.
          </div>
          <div class="font-nunito_bold">$39.99</div>
        </div>
      </div>
      <div class="self-end w-3/5 font-nunito_bold text-gray-500 text-center 
        border border-gray-400 hover:bg-gray-400 hover:text-white p-1 mx-auto mb-4 
        rounded-lg cursor-pointer">
        Add to Cart
      </div>
    </div>
  </div>

  <div class="flex items-stretch sm:w-1/2 md:w-1/3 px-2 mb-4">
    <div class="flex flex-col bg-gray-100 rounded-lg overflow-hidden">
      <div class="flex-grow">
        <img class="w-full" src="img/003.jpg" loading="lazy" alt="Kodak Instamatic 100 camera">
        <div class="px-6 py-4">
          <div class="text-lg font-nunito_bold">Kodak Instamatic 100</div>
          <div class="text-sm font-nunito_light">
            Pariatur perspiciatis doloribus deserunt sed eligendi veritatis
            corrupti. Inventore doloremque quia doloribus aliquid. Qui earum
            rerum eius ad qui.
          </div>
          <div class="font-nunito_bold">$23.25</div>
        </div>
      </div>
      <div class="self-end w-3/5 font-nunito_bold text-gray-500 text-center 
        border border-gray-400 hover:bg-gray-400 hover:text-white p-1 mx-auto mb-4 
        rounded-lg cursor-pointer">
        Add to Cart
      </div>
    </div>
  </div>

</div>