JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <div class="row">
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/300" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/290" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/280" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/350" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/370" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/240" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/510" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/200" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/325" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/415" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/380" />
      </div>
    </div>
    <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
      <div class="thumbnail">
        <img src="https://unsplash.it/200/315" />
      </div>
    </div>
  </div>
</div>

CSS

@import url('https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css');
@media (min-width:768px) and (max-width: 991px) {
  .row > div:nth-child(2n+3) {
    clear: left;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .row > div:nth-child(3n+4) {
    clear: left;
  }  
}
@media (min-width: 1200px) {
  .row > div:nth-child(4n+5) {
    clear: left;
  }  
}