JSFiddle - React, Tailwind, and code Playground

HTML

<div class='wrap'>
  <div class='ele1'>
    <div class='element'>HELLO</div>
  </div><div class="ele1">
    <div class='element'>WORLD</div>
  </div>
</div>

CSS

.wrap {
    background:red;
    white-space:nowrap;
    width:300px;
}
.ele1 {
    display:inline-block;
    width:50%;
    padding:4px;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
}
.element {
    background:#009; color:#cef; text-align:center;
    display:block;
}