JSFiddle - React, Tailwind, and code Playground

HTML

<div class="test">
<span class="floater">Flfdgdgjfddddddddddddddddddddddddddddddddddddyuittttttthvgmchfghjhgyhghoats</span>
<h1>This should be within the box.</h1>
<p>Why would I want to know that? Maybe I love you so much I love you no matter who you are pretending to be. Um, is this the boring, peaceful kind of taking to the streets? Good news, everyone! There's a report on TV with some very bad news! Oh, I think we should just stay friends.</p>
</div>

CSS

body {
    padding: 20px;
}
.floater {
    float: right;
    /*width: 100%;*/
}
h1 {
    margin-top: -10px;
}
.test {
    width: 500px;
    padding: 10px;
    background: #EEE;
}