JSFiddle - React, Tailwind, and code Playground

by venkateshwar

HTML

<div id="container">
  <table>
    <tr>
      <td>1</td>
      <td>
        <div>abcdefghijklmnopqrstuvwxyzyxwvutsrqponmlkjihgfedcba</div>
      </td>
    </tr>
  </table>
</div>

CSS

#container {
  width: 100px;
  border: 1px solid green;
}

table {
  width: 100%;
  border: 1px solid blue;
}

table td {
  max-width: 0;
}

table div {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}