JSFiddle - React, Tailwind, and code Playground

HTML

<div style="width: 100px; height: 30px; overflow:hidden; ">
    <span id="right">123</span>
    <span id="left">asdfafadfsasdasdfafadfsasd</span>
</div>

CSS

div{
    white-space:nowrap;
    text-overflow:ellipsis;
    -o-text-overflow:ellipsis;
}
#right{
    float: right;
}