JSFiddle - React, Tailwind, and code Playground

by poztin

HTML

<table style="table-layout:fixed; width:100%;">
    <tr>
        <td class="test">The quick brown fox jumps over the lazy dog</td>
        <td></td>
    </tr>    
</table>
<br/>
<span class="test">
  The quick brown fox jumps over the lazy dog  
</span>

CSS

.test
{
    display:block;
    border-bottom: 1px dashed #333;
    padding: 2px 5px;
    text-overflow:ellipsis;
    overflow:hidden;
    white-space:nowrap;
    width:75px;
}
.test:active{
    width:auto;
}