JSFiddle - React, Tailwind, and code Playground

HTML

<span class="orange" title="12 12">
    <span>first_verylongworddddddddddddddddddddddddddddddddddddddddddd</span> 
    <span>second_verylonglonglonglonglonglonglonglonglonglong</span>
</span>

CSS

.orange {
    color: #f58026;
    display: block;
    text-overflow: ellipsis;
}
.orange span {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}