JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/masonry/3.3.0/masonry.pkgd.js"></script>
<div class="grid" id="grid">
<div class="row">
  <form>
   <div class="col-md-4 grid-item" style="height: 0px;"></div>
   <div class="col-md-4 grid-item">
     <div class="panel panel-default">
       <div class="panel-heading">Title 1</div>
       <div class="panel-body">Content here..</div>
     </div>
   </div>
   <div class="col-md-4 grid-item">
     <div class="panel panel-default">
       <div class="panel-heading">Title 2</div>
       <div class="panel-body">Content here..</div>
     </div>
   </div>
  </form>
</div>

<div class="row">
 <form>
   <div class="col-md-4 grid-item">
     <div class="panel panel-default">
        <div class="panel-heading">E</div>
        <div class="panel-body">Content here..</div>
     </div>
   </div>
   <div class="col-md-4 grid-item">
     <div class="panel panel-default">
       <div class="panel-heading">Title F</div>
       <div class="panel-body">Content here..</div>
     </div>
   </div>
   <div class="col-md-4 grid-item">
     <div class="panel panel-default">
      <div class="panel-heading">Title G</div>
      <div class="panel-body">Content here..</div>
    </div>
  </div>
  <div class="col-md-4 grid-item">
    <div class="panel panel-default">
       <div class="panel-heading">Title H</div>
      <div class="panel-body">Content here..</div>
     </div>
  </div>
 </form>
 </div>
</div>

CSS

.col-md-4 {
    border: 1px solid black;
}

JavaScript

$(document).ready(function() {
  $('#grid').masonry({
   columnWidth: 320,
   itemSelector: '.grid-item'
  });
});