JSFiddle - React, Tailwind, and code Playground

HTML

<div id="parent" style="width: 150px; display: inline-block; white-space: nowrap">
    
    <div id="one" class="kids">
        <span>Hi</span>
    </div>
    
    <div id="two" class="kids">
        <span>Bob like to play on his violin</span>
    </div>
    
</div>

CSS

#parent {
    background-color: #aaaaaa
}
#one {
    background-color: #ff0000
}

#two {
    background-color: #00ff00
}

.kids {
    display: inline-block;
    padding: 2px;
    white-space: normal;
}