JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <span id="d1">
         Text1
    </span>
    <span id="d3">
        Text3
    </span>  
    <div id="d2">
        Text2
    </div>
</div>

CSS

#container {
    overflow:hidden;
    width: 100%;
    float: left;
}

#d1 {
    border: 1px solid #0f0;
    display: inline-block;
    float: left;
}

#d3 {
    border: 1px solid #0f0;
    display: inline-block;
    float: right;
}

#d2 {
    border: 1px solid #000;
    overflow: hidden;
}