JSFiddle - React, Tailwind, and code Playground

HTML

<table>
  <thead>
    <tr>
      <th>SKU</th>
      <th>Description</th>
      <th>Availability</th>
      <th>Location</th>
      <th>Status</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>4000.4</td>
      <td>Lemon soda<img src="data:image/gif;base64,R0lGODlhEAAQANUAAA5TiDmd6nmDihZ2v057nStqmZSntR1djhyP52Sy7lRod9TX2RZzuhIoOYKftiiHz1es7WB+loqZpjGBvj1znDKZ6TBqlpCqvyxmkpqsulKCpkKi6yiV6GGCm5apt0Gh605/pGaEm4Wit5+wvY6cpz2f6y1plzWb6YOhtz5zmzNrlVis7UWj6zCBv////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAC4ALAAAAAAQABAAAAZoQJdwSCwKisIRQcMEWRRIl+GRqJ5YAAxyWk1MSA1OocjtphYSxHhY7pYok83alaF27wm5sI2vfkwuHnZ9VSsMFy4qhF0QDA5CIQGLjY9DERV9EAOVRJd3mpxFngmgUZYVpaZDHQcipkEAOw=="></td>
      <td>10/10/2021</td>
      <td>London, United Kingdom</td>
      <td>Waiting</td>
    </tr>
    <tr>
      <td>3000.3</td>
      <td>Orange juice<img src="data:image/gif;base64,R0lGODlhEAAQANUAAA5TiDmd6nmDihZ2v057nStqmZSntR1djhyP52Sy7lRod9TX2RZzuhIoOYKftiiHz1es7WB+loqZpjGBvj1znDKZ6TBqlpCqvyxmkpqsulKCpkKi6yiV6GGCm5apt0Gh605/pGaEm4Wit5+wvY6cpz2f6y1plzWb6YOhtz5zmzNrlVis7UWj6zCBv////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEHAC4ALAAAAAAQABAAAAZoQJdwSCwKisIRQcMEWRRIl+GRqJ5YAAxyWk1MSA1OocjtphYSxHhY7pYok83alaF27wm5sI2vfkwuHnZ9VSsMFy4qhF0QDA5CIQGLjY9DERV9EAOVRJd3mpxFngmgUZYVpaZDHQcipkEAOw=="></td>
      <td>12/11/2021</td>
      <td>Paris, France</td>
      <td>Shipped</td>
    </tr>
    <tr>
      <td>2000.2</td>
      <td>An unknown long product to drink when you would like<img...

CSS

table {
  font-family: Tahoma, Arial, Helvetica, sans-serif;
  font-size: small;
  text-align: left;
  vertical-align: middle;
  border-collapse: collapse;
  border: 0;
  margin: 0;
  width: 98%;
}

table th,
table td {
  /* Default text alignment */
  text-align: center;
  vertical-align: middle;

  /* Separate border */
  border: 2px solid white;
  border-top: 0;
  border-bottom: 0;
  padding: 2px;
}

/* Header */
table th {
  background: #0093DD;
  color: white;
}

/* Footer */
table tfoot::before {
  content: '';
  display: block;
  height: 8px;
}

table tfoot td:first-child {
  text-align: left;
  padding-left: 16px;
}

table tfoot td:last-child {
  text-align: right;
  padding-right: 16px;
}

/* Alternate line colors */
table tbody tr:nth-child(even) td {
  background: #EFEFEF;
}


/* Description column left aligned */
table tbody td:nth-child(2) {
  text-align: left;
}

/* Columns width */
table tbody td:nth-child(1),
table tbody td:nth-child(5) {
  width: 90px;
}

table tbody td:nth-child(2) {
  width: auto;
}

table tbody td:nth-child(3) {
  width: 90px;
}

table tbody td:nth-child(4) {
  width: 160px;
}

/* I would like the image to be right aligned inside the <td> and vertically centered */
img {
  float: right;
  padding-right: 2px;
}