JSFiddle - React, Tailwind, and code Playground

by mslocum

HTML

<div id="fileName"><span>This is the big name of my file.txt</span><span>This is the big name of my file.txt</span>
</div>

CSS

#fileName span {
    white-space: nowrap;
    overflow: hidden;
    display:inline-block;
}
#fileName span:first-child {
    width: 100px;
    text-overflow: ellipsis;
}
#fileName span + span {
    width: 100%;
    direction:rtl;
    text-align:right;
}