JSFiddle - React, Tailwind, and code Playground

by shanejones

HTML

<p class="with-dots">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi nesciunt nobis qui quam tenetur.</p>
<p class="withou-dots">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi nesciunt nobis qui quam tenetur.</p>

CSS

.with-dots {
    display:inline-block;
    width:180px;
    white-space: nowrap;
    overflow:hidden !important;
    text-overflow: ellipsis;
}

.without-dots {
    display:inline-block;
    width:180px;
    white-space: nowrap;
    overflow:hidden !important;
}