Meaningless Notebook

Flex Box めっちゃ便利

親要素 {
  display: flex;
  flex-direction: column;
  height: 100%;
}

スクロ－ル可能にさせたい子要素 {
  flex: 1;
  overflow-y: auto;
}

flex 使わないと height: 100% で割り当てられる高さが、親要素の高さ – 高さが不定な要素 にならないで親要素の高さが割り当てられてダメだった。

こういう時、地力の無さが露呈するな…

参考元

• 高さが可変する要素の下にスクロール可能なコンテンツを設置する方法（CSSのみ）
• Flexboxを使って要素をスクロールさせるときの高さを可変にする