JSFiddle - React, Tailwind, and code Playground

HTML

<div class="tnwrapper">
    <div class="main-image">
      <div class="tn">
          <img src="http://placehold.it/96x96" alt="" class="thumbnail">
      </div>
    </div>

		<div class="child-images">
		    <div class="tn">
				<img src="http://placehold.it/96x96" alt="" class="thumbnail child">
		  </div>

		<div class="tn">
				<img src="http://placehold.it/96x96" alt="" class="thumbnail child">
		</div>	
      
      <div class="tn">
				<img src="http://placehold.it/96x96" alt="" class="thumbnail child">
		</div>

		<div class="tn">
				<img src="http://placehold.it/96x96" alt="" class="thumbnail child">
		</div>
    <div class="tn">
				<img src="http://placehold.it/96x96" alt="" class="thumbnail child">
		</div>

		<div class="tn">
				<img src="http://placehold.it/96x96" alt="" class="thumbnail child">
		</div>	
		</div>
	</div>

CSS

.tnwrapper {
  background-color: #000;
  padding: 5px 5px 5px 9px;
  border-radius: 4px;
  display: -webkit-flex;
  display: flex;
}

.child-images {
   display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-flex-wrap: wrap;
   flex-wrap: wrap;
   margin: 0 10px;  
   height: 170px;
}

.tnwrapper .tn .thumbnail {
  padding: 4px;
  margin: 10px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.child-images .tn img {
  width: 40px;
}