JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://masonry.desandro.com/masonry.pkgd.min.js"></script>
<div id="container">
    <div class="masonryImage">
        <img src="http://placehold.it/250x360/ffffee" />
    </div>
         
    <div class="masonryImage">
        <img src="http://placehold.it/250x320/ffeeee" />
    </div>
         
    <div class="masonryImage">
        <img src="http://placehold.it/250x340/eeeeee" />
    </div>

    <div class="masonryImage">
        <img src="http://placehold.it/250x320/eeeedd" />
    </div>

    <div class="masonryImage">
        <img src="http://placehold.it/250x340/eedddd" />
    </div>
         
    <div class="masonryImage">
        <img src="http://placehold.it/250x310/dddddd" />
    </div>
    
     <div class="masonryImage">
         <img src="http://placehold.it/250x330/ddddcc" />
    </div>
    
     <div class="masonryImage">
        <img src="http://placehold.it/250x310/ddcccc" />
    </div>

    
</div>

CSS

#container { width:1200px }
.masonryImage { width: 25%; }
.masonryImage img { width:100%; }

JavaScript

var $container = $('#container');
// initialize
$container.masonry({
  itemSelector: '.masonryImage',
  gutter: 15
});