JSFiddle - React, Tailwind, and code Playground

HTML

<div style="width: 150px">
    <div class="line">
        <span>Very long label text</span>
        <span>12345</span>
    </div>
</div>
<div style="display: table; width: 150px">
    <div style="display: table-cell">
        <div class="line">
            <span>Very long label text</span>
            <span>12345</span>
        </div>
    </div>
</div>

CSS

.line {
    display: flex;
    width: 100%;
}
.line span:first-child {
    white-space: nowrap;
    flex-grow: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}
.line span:last-child {
    flex-shrink: 0;
    margin-left: 5px;
}