flex如何排版3宫格，不足3宫格时需要按照最大尺寸排版？

Question

1. 比如我有3张图片，排版的时候就按照 一列排3张，
   只有2张的时候，排2张，尺寸稍微放大点
   只有1张的时候，尺寸最大。

Answer 1

伸缩系数调成一样就可以了。demo：https://codepen.io/eternalsky...

Answer 2

flex-grow 1
min-width 33.33333333333%

Answer 3

<style>
    .box {
      display: flex;
      flex-wrap: wrap;
    }

    .item {
      flex: 1;
      min-width: 33.33%;
      max-width: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 300px;
      padding: 5px;
      box-sizing: border-box;
    }

    .item-inner {
      flex: 1;
      height: 100%;
      background: gray;
      display: flex;
      justify-content: center;
      align-items: center;
      color: #fff;
      font-size: 30px;
    }
  </style>

<div class="box">
    <div class="item">
      <div class="item-inner">1</div>
    </div>
    <div class="item">
      <div class="item-inner">2</div>
    </div>
    <div class="item">
      <div class="item-inner">3</div>
    </div>
    <div class="item">
      <div class="item-inner">4</div>
    </div>
    <div class="item">
      <div class="item-inner">5</div>
    </div>
  </div>