如何将Bootstrap列中的内容对齐到列底部？

我正在为个人网站学习Bootstrap，目前遇到侧边栏内容无法对齐到底部的问题，查阅多个相关帖子后仍未找到正确解决方案。

我的HTML代码如下：

<!--
    author: elia deppe
    file: index.html
    description: index page for portfolio website
-->

<!DOCTYPE html>
<html lang='en'>
<head>
    <!-- metadata -->
    <meta charset='UTF-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1'>

    <!-- title -->
    <title>elia deppe</title>

    <!-- stylesheets -->
    <link href='css/bootstrap.css' rel='stylesheet'>
    <link href='css/style.css' rel='stylesheet'>

    <!-- fonts -->
    <link href="https://fonts.googleapis.com/css?family=Anonymous+Pro:400,400i,700&display=swap" rel="stylesheet">
</head>
<body>
<div class='container-fluid'>
    <div class='row min-vh-100'>
        <div class='col sidebar text-end' style='background-color: #ffbd69'>
            <!-- Picrewの「character」でつくったよ！ https://picrew.me/share?cd=vcQauzSoob #Picrew #character -->
            <img src='img/avatar.png'
                 alt='Picrewの「character」でつくったよ！ https://picrew.me/share?cd=vcQauzSoob #Picrew #character'
                 class='avatar'>
            <h1>elia deppe</h1>
            <h2>teacher - code in the schools</h2>
            <h3>software / web / app developer</h3>
        </div>
        <div class='col' style='background-color: #3dd5f3'>
            <p>content</p>
        </div>
    </div>
</div>
</body>
</html>

• 当前渲染效果：侧边栏内容靠顶部展示
• 期望效果：侧边栏内容对齐到容器底部

解决方案 #

最终通过Flexbox实现了正确排版，为侧边栏添加的CSS代码如下：

.sidebar {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: flex-end;
    align-content: flex-end;

    /* minimum width */
    -ms-flex: 0 0 500px;
    flex: 0 0 500px;
}

感谢@Tayyab提供的帮助。

内容的提问来源于stack exchange，提问作者eliaseraphim