JSFiddle - React, Tailwind, and code Playground

HTML

<div class="crop">
    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged
</div>

CSS

div { background:#eee; border:1px dotted #ccc; margin:1em; padding:5px; }
.crop { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; width:100px; }