如何将flexbox元素推到单独行中剩余的垂直空间的顶部？

Question

我试图让flexbox元素移动到它顶部的元素正下方，但我无法弄清楚如何。有没有办法做到这一点？每个元素都应该是自适应的，但间距总是相同的。

请使用摘录中的全屏！

＆＃13;

＆＃13;

.container {
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
}

.container div {
    width: 25em;
    min-height:75vh;
    text-align: center;
    position: relative;
    min-height:100px;
    padding: 5px;
    margin: 2em;
    background-color: red;
    border-radius: 0.6em;
    margin-top: 0em;
    flex-direction: column;
    display: flex;
    justify-content: center;
}

＆＃13;

<div class="container">
  <div>
    <p>Hi man</p>
    <p>Hi man</p>
  </div>
  <div>
    <p>Hi man</p>
    <p>Hi man</p>
    <p>Hi man</p>
    <p>Hi man</p>
    </div>
  <div>
    <p>Hi man</p>
    <p>Hi man</p>
    <p>Hi man</p>
    
  </div>
  <div>    
    <p>Hi man</p>
   </div>
  <div>    
    <p>Hi man</p>    
    <p>Hi man</p>
  </div>
  <div></div>
</div>

＆＃13;

＆＃13;

＆＃13;