JSFiddle - React, Tailwind, and code Playground
HTML
collapsing margin
<div style="width:200px;background-color:red">
<div style="width:50%;float:left;">
left side
</div>
<div style="margin-left:50%;width:50%;margin-top:10px;">
right side
</div>
</div>
<hr />
non collapsing margin
<div style="width:200px;border:1px solid red">
<div style="width:50%;float:left;">
left side
</div>
<div style="margin-left:50%;width:50%;margin-top:10px;">
right side
</div>
</div>