JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <p class="ellipsis">Text very laaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaarge</p>
</div>

CSS

div {
    width: 100%; /* Add the size that you want */
}

.ellipsis {
    word-wrap: break-word;
    border: 1px solid black;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}