JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.isotope/2.2.1/isotope.pkgd.min.js"></script>
<script src="https://isotope.metafizzy.co/v1/jquery.isotope.min.js"></script>
<div id="container">
    <div class="item">
        <p class="weight">33</p>
    </div>
    <div class="item">
        <p class="weight">22</p>
    </div>
    <div class="item">
        <p class="weight">3</p>
    </div>
    <div class="item">
        <p class="weight">2</p>
    </div>
    <div class="item">
        <p class="weight">9</p>
    </div>
    <div class="item">
        <p class="weight">1</p>
    </div>
    <div class="item">
        <p class="weight">33</p>
    </div>
    <div class="item">
        <p class="weight">22</p>
    </div>
    <div class="item">
        <p class="weight">33</p>
    </div>
    <div class="item">
        <p class="weight">22</p>
    </div>
</div>

CSS

#container{
    position: relative;
}
.item {  
    width: 50px;
    height: 50px;
    background: #AAA;
    margin: 5px;
    float: left;
    display: inline-block;
}
/* Start: Recommended Isotope styles */

/**** Isotope Filtering ****/
 .isotope-item {
    z-index: 2;
}
.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}
/**** Isotope CSS3 transitions ****/
 .isotope, .isotope .isotope-item {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    transition-duration: 0.8s;
}
.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    transition-property: height, width;    
}
.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    transition-property: transform, opacity;
}
/**** disabling Isotope CSS3 transitions ****/
 .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    transition-duration: 1s;
}
.cer {
    width: 50px;
    height: 50px;
    background: #AAA;
    margin: 5px;
    float: left;
}
/* End: Recommended Isotope styles */

JavaScript

var $container = $('#container').isotope({
    itemSelector: '.item',
    isResizeBound: false,
    masonry: {
      columnWidth: '.grid-sizer'
    }
   
});
 $(window).resize(function(){
    isotope.isotope('layout');
  });