JSFiddle - React, Tailwind, and code Playground

HTML

<div class='table'>
    <div class='row'>
        <div class='cell'>Something quite long</div>  
        <div class='cell'>
            here is some moreSomething quite long that should exceed the table cell.Something quite long that should exceed the table cell.
        </div>          
    </div>
</div>

<table>
<thead>
<tr>
<th>
老师你好啊啊啊
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
here is some moreSomething quite long that should exceed the table cell.Something quite long that should exceed the table cell.
</td>
</tr>
</tbody>
</table>

CSS

.table{
    margin:0;
    padding:0;
    display:table;
    table-layout: fixed;
    width:100%;
    max-width:100%;
    border: 1px solid;
}
.row{
    display:table-row;
}
.cell{
    display:table-cell;
        white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;
}