flex布局换行左对齐并且间距相同

在flex布局下，确定每行显示个数，模块宽度一样，最后一行模块个数不确定，模块左对齐，并且每个模块的间隔相同。

效果：

HTML:

<div class="box">
     <div class="item"></div>
     <div class="item"></div>
     <div class="item"></div>
     <div class="item"></div>
     <div class="item"></div>
     <div class="item"></div>
</div>

CSS:

.box{display:flex;flex-wrap: wrap;padding:0 2%;box-sizing:border-box;}
.box .item{height:100px;background:#d00;margin-bottom:2%;flex:0 0 23.5%;margin-right:2%;}
.box .item:nth-of-type(4n){margin-right:0;}

一行显示模块的宽度+模块之间的间隔宽度为100%。