JSFiddle - React, Tailwind, and code Playground

HTML

<div class="clearfix">
  <div class="left">
    меню
  </div>
  <div class="right">
    <div class="wrap-box clearfix">
      <div class="box">
        <div class="item">
          товар
        </div>
      </div>
      <div class="box">
        <div class="item">
          товар
        </div>
      </div>
      <div class="box">
        <div class="item">
          товар
        </div>
      </div>
      <div class="box">
        <div class="item">
          товар
        </div>
      </div>
      <div class="box">
        <div class="item">
          товар
        </div>
      </div>
      <div class="box">
        <div class="item">
          товар
        </div>
      </div>
    </div>
  </div>
</div>

CSS

*, *:after, *:before{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.clearfix:after{
  content:"";
  display:table;
  width:100%;
  height:0;
  clear:both;
}
.left{
  width:250px;
  height:750px;
  float:left;
  background-color:#cf5caa;
}

.right{
  margin-left:250px;
  background-color:#ccaaee;
  padding:20px;
}

.wrap-box{
  display: inline-block;
  width: 100%;
  background-color:#aacccc;
}
.box{
  width:33.33%;
  float:left;
  padding:10px;
  
  
}

.item{
  height:50px;
  background-color:#aaabdd;
}

.box:nth-child(3n+1){
  clear:both;
}