SOURCE

<div class="box">
    <div class="item1">a</div>
    <div class="item2">b</div>
    <div class="item3">c</div>
    <div class="item4">d</div>
</div>

.box {
    display: flex;
    height: 200px;
    background: red;

    /*  测试 */
    /* flex-direction: column; */
    /* justify-content: center; */
}
.item1 {
    height: 50px;
    width: 50px;
    background: blue;
}
.item2 {
    height: 50px;
    width: 50px;
    background: green;
}
.item3 {
    height: 50px;
    width: 50px;
    background: pink;
}
.item4 {
    height: 50px;
    width: 50px;
    background: yellow;
}