JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<div class="row">
  <div class="col-sm-6">
    <div>
      <div class="item">
        Content
      </div>
      <div class="item">
        Content
      </div>
      <div class="item">
        Content
      </div>
    </div>
  </div>
  <div class="col-sm-6">
    <div>
      <div class="item">
        Content
      </div>
      <div class="item">
        Content
      </div>
      <div class="item">
        Content
      </div>
      <div class="item">
        Content
      </div>
    </div>
  </div>
</div>

SCSS

.row {
  display: flex;
  flex-flow: row wrap;
  
  .col-sm-6 > div {
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    height: 100%;
    
    .item {
      height: 20px;
      text-align: center;
      background-color: red;
      margin: 2px;
    }
  }
}