JSFiddle - React, Tailwind, and code Playground

HTML

<div style="border: 4px solid blue; white-space:nowrap; margin:0; padding:0; width:80%">
    
   <div style="display:inline-block; width:45%; overflow:hidden; margin:0; border: 1px solid red"> Flimmy-flammy
    </div>
    
    <div style="display:inline-block; width:50%; overflow:hidden; margin:0px; border: 1px solid green"> Hambone-Sammy
    </div>
    
</div>

CSS

div { float: left; }