JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.2/css/foundation.css">
<div class="row">
    <div class="small-12 medium-6 large-4 columns"><h1>1</h1></div>
  <div class="small-12 medium-6 large-4 medium-push-3 columns"><h1>2</h1></div>
  <div class="small-12 medium-6 large-4 medium-pull-3 columns"><h1>3</h1></div>
  <div class="small-12 medium-6 large-4 columns"><h1>4</h1></div>
</div>

CSS

h1{
    display:block;
    height:40px;
    line-height:40px;
    border:1px solid green;
    width:100%;
}