JSFiddle - React, Tailwind, and code Playground

HTML

<div class="clear"> 
    <p>I'm a paragraph and I'm on the left!!!</p> 
    <h3>I'm a header and I'm on the right</h3> 
    <p>I'm a paragraph and I'm on the left!!!</p>
</div>

CSS

div {
    background: red;
}

div p{
    float: left;
    width:30%;
    border: 1px solid blue;
}

div h3{
    float:left;
    width:10%;
    border: 1px solid red;
}

.clear:after {
    clear: both;
    content: "";
    display: table;
}