JSFiddle - React, Tailwind, and code Playground

HTML

<main>
    <section>
        Section stuff<br />
        Foo<br />
        Bar
    </section>
    <aside>
        Aside stuff
    </aside>
</main>
<br /><br /><br />
<main>
    <section>
        Only section stuff
    </section>
</main>

CSS

main {
    padding: 5%;
    border: 3px dashed orange;
}

/* clearfix */
main:after {
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}

main > aside {
    float: right;
    width: 20%;
    background: silver;
}

main > section {
    width: 70%;
    background: blue;
    float: left;
}

main > section:only-child {
    width: 100%;
    float: none;
    background: green;
}