如何在列中对齐行flex元素？

Question

我使用flex来对齐我的元素。 #sentinels是最外面的容器，div的每一行（下例中为绿色）都有line类。

#sentinels {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.line {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

这给出了

但是，我希望div在列中对齐：

flex是否可以进行此类设置？

Answer 1

看看这个https://jsbin.com/jevaqovaga/edit?html,css,output。每个内部div的宽度为100％的外部div可以解决您的问题。