JSFiddle - React, Tailwind, and code Playground

by von

HTML

<div class="row">
  <div class="column col-md-2 col-sm-2 col-xs-2"></div>
  <div class="column col-md-8 col-sm-8 col-xs-8">Five Columns</div>
  <div class="column col-md-2 col-sm-2 col-xs-2"></div>
</div>
<div class="row">
  <div class="column col-md-2 col-sm-2 col-xs-2"></div>
  <div class="column col-md-8 col-sm-8 col-xs-8">
    <div class="row row-cols-5">
      <div class="col">
        <img src="https://via.placeholder.com/240x218" class="img-fluid img-responsive">
      </div>
      <div class="col">
        <img src="https://via.placeholder.com/240x218" class="img-fluid img-responsive">
      </div>
      <div class="col">
        <img src="https://via.placeholder.com/240x218" class="img-fluid img-responsive">
      </div>
      <div class="col">
        <img src="https://via.placeholder.com/240x218" class="img-fluid img-responsive">
      </div>
      <div class="col">
        <img src="https://via.placeholder.com/240x218" class="img-fluid img-responsive">
      </div>

    </div>
  </div>
  <div class="column col-md-2 col-sm-2"></div>
</div>
<div class="row">
  <div class="column col-md-2 col-sm-2 col-xs-2"></div>
  <div class="column col-md-8 col-sm-8 col-xs-8">
    <div class="row">
      <div class="column col-sm-2  col-md-2"></div>
      <div class="column col-sm-2 col-md-2"></div>
      <div class="column col-sm-2 col-md-2"></div>
      <div class="column col-sm-6  col-md-2"></div>
      <div class="column col-sm-6  col-md-2"></div>
    </div>
  </div>
  <div class="column col-md-2 col-sm-2"></div>
</div>