JSFiddle - React, Tailwind, and code Playground

HTML

<table>
  <tr>
    <td><div>1</div></td>
    <td><div>2</div></td>
    <td><div>3</div></td>
    <td><div>4</div></td>
    <td><div>5</div></td>
    <td><div>6</div></td>
    <td><div>7</div></td>
    <td><div>8</div></td>
    <td><div>9</div></td>
    <td><div>10</div></td>
  </tr>
  <tr>
    <td><div>1</div></td>
    <td><div>2</div></td>
    <td><div>3</div></td>
    <td><div>4</div></td>
    <td><div>5</div></td>
    <td><div>6</div></td>
    <td><div>7</div></td>
    <td><div>8</div></td>
    <td><div>9</div></td>
    <td><div>10</div></td>
  </tr>
</table>

CSS

table {
  width: 100%;
}

td {
  border: 1px solid black;
  position: relative;
}

td > div {
  position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

td:before {
	content: "";
	display: block;
	padding-top: 75%;
}