JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td>
            <div> 
                <p>
                    this is a long sentence to test the text overflow
                </p>
            </div>
        </td>
    </tr>
</table>

CSS

table {
    width: 50px;
    table-layout: fixed;
}
td {
    border: 1px solid red;
}

div {

}

p {
    white-space: nowrap;
    text-overflow: ellipsis;
    width:50px;
    overflow:hidden
}