JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <thead>
        <tr>
            <th>one</th>
            <th>two</th>
            <th>three</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><span>asldf lkasjdflasdkj laksdjflasdkjjf asdfasd asdf asd</span>

            </td>
            <td></td>
            <td></td>
        </tr>
    </tbody>
</table>

CSS

th, td {
    width: 33%;
    border: 1px solid black;
    max-width:200px;
}
table {
    width: 100%;
}
span {
    width: 100%;
    display:block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}