JSFiddle - React, Tailwind, and code Playground

HTML

<div class="truncate">
  <span>This is a too long text to normally fit in</span>
</div>

CSS

.truncate {
  width: 100px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}