is now part of Shuffle™. You can use the editor on this domain, but we encourage you to try Shuffle.dev. Shuffle™ includes templates for Tailwind CSS, Bootstrap, Bulma, and Material-UI.
← Tailwind CSS classes list

Tailwind CSS class: .table-auto / .table-fixed

<table class="table-auto">
  <thead>
    <tr>
      <th class="px-4 py-2">Header 1</th>
      <th class="px-4 py-2">Header 2</th>
      <th class="px-4 py-2">Header 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="border px-4 py-2">Lorem ipsum dolor sit amet</td>
      <td class="border px-4 py-2">Lorem</td>
      <td class="border px-4 py-2">Lorem</td>
    </tr>
    <tr class="bg-gray-100">
      <td class="border px-4 py-2">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
        Morbi eget augue consequat dolor posuere dignissim.
        Duis libero purus, sodales eget erat in, condimentum placerat orci.</td>
      <td class="border px-4 py-2">Lorem</td>
      <td class="border px-4 py-2">Lorem</td>
    </tr>
  </tbody>
</table>

<table class="table-fixed">
  <thead>
    <tr>
      <th class="w-1/2 px-4 py-2">Header 1</th>
      <th class="w-1/4 px-4 py-2">Header 2</th>
      <th class="w-1/4 px-4 py-2">Header 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="border px-4 py-2">Lorem ipsum dolor sit amet</td>
      <td class="border px-4 py-2">Lorem</td>
      <td class="border px-4 py-2">Lorem</td>
    </tr>
    <tr class="bg-gray-100">
      <td class="border px-4 py-2">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
        Morbi eget augue consequat dolor posuere dignissim.
        Duis libero purus, sodales eget erat in, condimentum placerat orci.</td>
      <td class="border px-4 py-2">Lorem</td>
      <td class="border px-4 py-2">Lorem</td>
    </tr>
  </tbody>
</table>

Preview

Header 1 Header 2 Header 3
Lorem ipsum dolor sit amet Lorem Lorem
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi eget augue consequat dolor posuere dignissim. Duis libero purus, sodales eget erat in, condimentum placerat orci. Lorem Lorem
Header 1 Header 2 Header 3
Lorem ipsum dolor sit amet Lorem Lorem
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi eget augue consequat dolor posuere dignissim. Duis libero purus, sodales eget erat in, condimentum placerat orci. Lorem Lorem

CSS source

.table-auto { table-layout: auto; }
.table-fixed { table-layout: fixed; }

More in Tailwind CSS Table