JSFiddle - React, Tailwind, and code Playground

by corinnekm

HTML

<div>
    <ul>
        <li>
            <p>the text is too long</p>
        </li>   
        <li>
             <a>the link is too long</a>
        </li>
      </ul>
</div>

CSS

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

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

}