JSFiddle - React, Tailwind, and code Playground

HTML

<div class="truncate">
  No truncating at all, height adjusts to text: abcdefghijk abcdefghijk abcdefghijk abcdefghijk abcdefghijk abcdefghijk abcdefghijk abcdefghijk abcdefghijk abcdefghijk abcdefghijk abcdefghijk abcdefghijk 
</div>

CSS

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