Почему flex-base не устанавливает высоту flex-элементов с помощью flex-direction 'column'?

Question

Вот мой HTML:

<!-- NEW MEMBERS -->
<section class="new-members">
    <h2>New Members</h2>

    <div class="member">
        <img class="member-image" src="images/member-1.jpg" />
        <div class="member-info">
            <p>Victoria Chambers</p>
            <a href="mailto:webmaster@example.com">victoria@hotmail.com</a>
        </div>
        <p class="date">12/04/20</p>
    </div>

    <div class="member">
        <img class="member-image" src="images/member-2.jpg" />
        <div class="member-info">
            <p>Dale Byrd</p>
            <a href="mailto:webmaster@example.com">byrd@hotmail.com</a>
        </div>
        <p class="date">12/04/20</p>
    </div>

    <div class="member">
        <img class="member-image" src="images/member-3.jpg" />
        <div class="member-info">
            <p>Dawn Wood</p>
            <a href="mailto:webmaster@example.com">wood@hotmail.com</a>
        </div>
        <p class="date">12/04/20</p>
    </div>

    <div class="member">
        <img class="member-image" src="images/member-4.jpg" />
        <div class="member-info">
            <p>Dan Oliver</p>
            <a href="mailto:webmaster@example.com">oliver@hotmail.com</a>
        </div>
        <p class="date">12/04/20</p>
    </div> 

</section>


<!--RECENT ACTIVITY-->
<section class="recent-activity">

    <h2>Recent Activity</h2>

    <div class="member">
        <img class="member-image" src="images/member-1.jpg" />
        <div class="member-info">
            <p>Victoria Chambers commented on YourApp's SEO Tips</p>
            <p>4 hours</p>
        </div>
        <span class="arrow">&#10148;</span> 
    </div>

    <div class="member">
        <img class="member-image" src="images/member-2.jpg" />
        <div class="member-info">
            <p>Dale Byrd likes the post Facebook's Changes for 2016</p>
            <p>4 hours</p>
        </div>
        <span class="arrow">&#10148;</span> 
    </div>

    <div class="member">
        <img class="member-image" src="images/member-3.jpg" />
        <div class="member-info">
            <p>Dawn Wood commented on Facebook's Changes for 2016</p>
            <p>5 hours</p>
        </div>
        <span class="arrow">&#10148;</span>
    </div>

    <div class="member">
        <img class="member-image" src="images/member-4.jpg" />
        <div class="member-info">
            <p>Dan Oliver posted YourApp's SEO Tips</p>
            <p>1 Day</p>
        </div>
        <span class="arrow">&#10148;</span> 
    </div> 

</section>

Вот мой соответствующий CSS:

/* NEW MEMBERS */ 
/* RECENT ACTIVITY */
.new-members, 
.recent-activity {
    display: flex;
    flex-direction: column;
}

.member {
    height: 65px;
    display: flex;
    align-items: center;
}
.member-image {
    border-radius: 50%;
    width: 10%;
    max-width: 70px;
} 

/* RECENT ACTIVITY */
.date {
    margin-left: auto;
}
.arrow {
    content: "\27A4";
    margin-left: auto;
} 

Каждый элемент div является элементом flex, а направление flex-контейнера flex-container -установить в столбце.Если flex-base работает на главной оси, а flex-container установлен в столбец, почему flex-base не манипулирует высотой flex-элементов, как я хочу их тоже?

Если я хочу манипулировать их высотой, я должен сделать это с помощью свойства height, но почему я не могу сделать это с помощью свойства flex-based?Без установки явной высоты переполнение элементов Flex:

Например: свойство Height со значением 65px: https://ibb.co/1RBdbby Свойство Flex-based с таким же точным значением (оно не имеет того же эффекта): https://ibb.co/t8K4HR3

Почему высота работает лучше, чем свойство flex-based?Я думал, что flex-base обязательно будет манипулировать высотой flex-элементов, когда для flex-direction установлено значение столбца.