JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://masonry.desandro.com/jquery.masonry.min.js"></script>
<div id="container" style="margin-left:-10px">
    <div class="left-column">
        <div class="infoBox" style="height: auto; margin-left:9px">
            Content goes here for basic info
        </div>
        <div class="infoBox" style="margin-left:9px; height: auto;">
            Content goes here for contact info
        </div>
    </div>
    <div class="right-column">
        <div class="infoBox" style="margin-left:9px; height: auto;">
            Content goes here for latest photos
        </div>
        <div class="infoBox" style="margin-left:9px; height: auto;">
            Content goes here for latest videos
        </div>
    </div>
    
     <div class="right-column">
        <div class="infoBox" style="margin-left:9px; height: auto;">
            Content goes here for latest photos
        </div>
        <div class="infoBox" style="margin-left:9px; height: auto;">
            Content goes here for latest videos
        </div>
    </div>
   
</div>

CSS

#container {width:480px;}
.left-column {
    width: 240px;
    float: left;
    
}
.right-column {
    width: 240px;
    float: right;
    
}
.infoBox {
    width: 220px;
    margin: -1px; 
    background-color:#37312d;
    padding:5px;
    border:#5b504a solid 1px;
    margin-bottom:9px;
    float:left;
}