JSFiddle - React, Tailwind, and code Playground

HTML

<div style="display: flex">
  <!-- Left -->
  <div style="background: yellow; flex: 1 0 0">
    VerylongtextVerylongtextVerylongtext
  </div>
  <!-- Right -->
  <div style="background: red; flex: 1 0 0">
    Right
  </div>
</div>

CSS

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}