将高度与Flexbox对齐

Question

我使用http://demo.agektmr.com/flexbox/作为参考，使用以下配置：

<div class="box">
  <div class="A">A</div>
  <div class="B">B</div>
  <div class="C">C</div>
  <div class="D">D</div>
  <div class="E">E</div>
</div>

.box {
    display: flex;
    flex-flow: row nowrap ;
    justify-content: space-around;
    align-content: space-between;
    align-items: center;
}

然后我为每个盒子设置不同的高度。它们在中间垂直对齐，但保持着它们的高度。

我如何使用flexbox使盒子具有灵活的高度，并且它们都适合最大的盒子？

一个实际的例子是一个带有2个侧边栏和一个内容栏的基本网站，它们具有动态内容，并且都应具有相同的高度。

Answer 1

根据this article，将align-items: center;更改为align-items: stretch;即可。