如何在Flexbox技术中“对齐项目”

Question

我正在尝试垂直对齐。我使用align-items并尝试更改容器的方向，但是仍然没有用。

<div class="menu-container">

            <div class="menu-logo">
                <img class="logo-image" src="https://internetingishard.com/img/interneting-is-hard-logo-97b225.svg"/>

            </div>

            <div class="menu-search">

                    <form class="menu-form">
                        <input class="menu-search-input" type="search" 
                        placeholder="Search" value="">
                    </form>



            </div>

            <div class="menu-user">

            </div>


        </div>

Css：

.menu-container{
    display: flex;
    background-color: white;
    position: fixed;
    height: 2.5em;
    width: 100%;
    border-bottom: 0.08em solid #efeaea;
    margin-bottom: 0.08em; 
    justify-content: space-between;
}

.menu-logo, .menu-notification{
    display: flex;
    flex-direction: column;
    flex: initial;
    width: 20%;
    justify-content: flex-start;

}
.logo-image, .notification-image{
    width: 80%;
    height: 70%;
    justify-content: center;
}

我已经尝试过更改容器的方向，但是还是没用。

我希望上面的代码渲染到菜单栏的中心。