Comment aligner et étirer verticalement du contenu à l'aide de CSS flexbox

Question

En utilisant CSS flexbox, comment puis-je centrer simultanément verticalement le contenu de toutes les divs en ligne tout en gardant la même hauteur sur toutes sans utiliser l'attribut css height?

Détails - http://jsbin.com/efaCEVa/1/edit

Answer 1

HTML

<div class='outer'>
    <div class='inner'>A</div>
    <div class='inner'>B</div>
    <div class='inner'>C</div>
</div>

CSS

.outer {
    align-items: stretch;
    display: flex;
}

.inner {
    align-items: center;
    display: flex;
}

Answer 2

  .item-wrapper
    display: flex
    align-items: stretch
    justify-content: center

  .item
    width: 400px
    display: flex