title: flex-flow: column wrap doesn't stretch the parent element's width
body: <p>When I use <code>flex-flow: column wrap</code>, the parent element's width is not stretched.</p>
  
  <p><img src="https://i.stack.imgur.com/EuBXE.jpg" alt="now"></p>
  
  <p><img src="https://i.stack.imgur.com/y19Nz.jpg" alt="expect"></p>
  
  <pre><code>*{
              margin: 0;
              padding: 0;
          }
          .box{
              background: #f03;
              position: relative;
              display: inline-block;
              /* top:10px; */
              /* left: 10px; */
              padding: 20px;
          }
          .in{
              display: flex;
              align-items: center;
              flex-flow: column wrap;
              max-height: 300px; 
              align-content: flex-start;
              justify-content: space-between;
  
          }
          .item{
              background: #fe3;
              width: 100px;
              margin-bottom: 20px;
              height: 100px;
  
          }
          .item:last-child{
              margin-left: 15px;
          }
      &lt;body&gt;
       &lt;div class="box"&gt;
           &lt;div class="in"&gt;
               &lt;div class="item"&gt;1&lt;/div&gt;
               &lt;div class="item"&gt;2&lt;/div&gt;
               &lt;div class="item"&gt;3&lt;/div&gt;
           &lt;/div&gt;
       &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p><a href="https://jsfiddle.net/p4oLk7dz/5/" rel="noreferrer">https://jsfiddle.net/p4oLk7dz/5/</a></p>
  
  <p><hr>
  So what should I do?</p>