JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <div class="content"></div>
  <div class="content"></div>
  <div class="content"></div>
  <div style="clear:both"></div>
</div>

CSS

* {
  margin:0;
  padding: 0;
}

.container {

  border: 1px solid red;
  display: table;
}

.content {

  border: 1px solid blue;

  width: 100px;

  height: 100px;

  float: left;

}

/* if screen width < .container width
   decrease last element from fisrt row
   decrease it's width from the container width
*/
@media only screen and ( max-width: 308px ) {
 .container {
   width: calc( 306px - 102px );
 }
}

@media only screen and ( max-width: 206px ) {
 .container {
   width: calc( 204px - 102px );
 }
}