JSFiddle - React, Tailwind, and code Playground

HTML

<div class="table">
  <div class="table-cell">one</div>
  <div class="table-cell">two</div>
  <div class="table-cell">three</div>
</div>
<div class="table">
  <div class="table-cell">one looooooooooooooooooong</div>
  <div class="table-cell">two</div>
</div>

<table>
<tr>
  <td>one</td>
  <td>two</td>
  <td>three</td>
</tr>
<tr>
  <td>one looooooooooooooooooong</td>
  <td colspan="2">two</td>
</tr>
</table>

CSS

.table-cell {
  display: table-cell;
  padding: 4px;
  border: 1px solid #efefef;
}
.table {
  display:table;
}
table{
  margin-top:30px;
  border-collapse: collapse;
}
td{
  border: 1px solid #efefef;
  padding: 4px;
}