JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <ul>
        <li><a href="#">Test link is soooo long</a></li>
    </ul>
</div>

CSS

div {
    border: 1px solid rgba(0,0,0,0.1);
    width: 100px;
}

a {
    
    overflow: hidden;
    text-overflow: ellipsis;
}