JSFiddle - React, Tailwind, and code Playground

by krewn

HTML

<table>
  <tr>
    <td id="td1">This is the first div.
    </td>
    <td id="td2">This is the second div. This is the second div.This is the second div. This is the second div. This is the second div.
    </td>
  </tr>
</table>

CSS

table {
       border-collapse: collapse;
       width:100%;
}
tr{
  display: flex;
}
td{
      white-space: nowrap;
      border: none;
      padding: 0px;
      text-align: left;
      overflow: hidden;
}
#td2 {
      text-overflow: ellipsis;
}