JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <div id="parent">
    <div class="row">
      <div id="child-left" class="pull-left">left<br>left</div>
      <div id="child-right" class="pull-right">right<br>right<br>right</div>
     </div>
    <div>
 <div>

CSS

#parent {background: purple; overflow: hidden;}
.row {display: table; height: 300px; width: 100%}
.row > div {display: table-cell; text-align: center; vertical-align: middle;}
#child-left {background: red; width: 40%;}
#child-right {background: blue; width: 60%;}