JSFiddle - React, Tailwind, and code Playground

by khamer

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/1.4.6/tailwind.min.css">
<main class="overflow-hidden">
  <div class="flex flex-wrap -mx-6 :md-mx-8">
    <div class="sm:w-1/2 md:w-1/3 px-6 pb-12 md:px-8 md:pb-16">
      <div class="bg-red-200 p-8">Lorem ipsum dolor.</div>
    </div>
    <div class="sm:w-1/2 md:w-1/3 px-6 pb-12 md:px-8 md:pb-16">
      <div class="bg-red-200 p-8">Lorem ipsum dolor.</div>
    </div>
    <div class="sm:w-1/2 md:w-1/3 px-6 pb-12 md:px-8 md:pb-16">
      <div class="bg-red-200 p-8">Lorem ipsum dolor.</div>
    </div>
    <div class="sm:w-1/2 md:w-1/3 px-6 pb-12 md:px-8 md:pb-16">
      <div class="bg-red-200 p-8">Lorem ipsum dolor.</div>
    </div>
    <div class="sm:w-1/2 md:w-2/3 px-6 pb-12 md:px-8 md:pb-16">
      <div class="bg-red-200 p-8">Lorem ipsum dolor.</div>
    </div>
  </div>
</main>