JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://npmcdn.com/masonry-layout@4.1.0/dist/masonry.pkgd.min.js"></script>
<div class="wrapper">
  <div class="item item_w2"></div>
  <div class="item "></div>
  <div class="item "></div>
  <div class="item"></div>
  <div class="item"></div>


</div>

CSS

.wrapper {
  max-width: 1200px;
}
.item {
    width: calc(33.333% - 2px);
    height: 400px;
    background-color: red;
    float: left;
    border: 1px solid white;
}

.item_w2   {
    width: calc(66.666% - 2px);
    background-color: blue;
    float: left;

}

JavaScript

var msnry = new Masonry(".wrapper", {
  itemSelector: ".item",
  columnWidth: ".item:not(.item_w2)"
});