0
フレックスボックスを使用して、垂直ナビゲーションバーの下部にある最後のアイテムを配置しようとしています。フレックスボックスを使ってこれを行う方法はありますか？ここでflexboxを使用して最後の要素を列の最後に配置するにはどうすればよいですか？
コードの例です：
<!doctype html>
<html>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
ul {
list-style: none;
background: red;
width: 100px;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: flex-start;
}
li {
border: 1px solid blue;
}
li:last-child {
background: blue;
align-self: end;
}
</style>
<body>
<ul>
<li>foo</li>
<li>foo</li>
<li>foo</li>
<li>foo</li>
<li>foo</li>
<li>foo</li>
</ul>
</body>
</html>