JSFiddle - React, Tailwind, and code Playground

HTML

<div style="float: left;">Left</div>
<div style="float: right;">Right</div>
<div style="clear: both; margin-top: 20px;">Main (the top margin is ignored)</div>

<br/><br/><br/>

<div style="float: left;">Left</div>
<div style="float: right; margin-bottom:20px;">Right (the bottom margin is applied)</div>
<div style="clear: both;">Main</div>

CSS

div {border:5px solid yellow;}