Как сделать сайдбар на всю высоту страницы?

Question

[Discout]

Как правильно сделать сайдбар, чтобы он был на всю высоту страницы независимо от содержимого?
Я вроде сделал, но получается какая-то ерунда, когда делаю браузер меньше в высоту, как на скриншоте.
Мой пример: codepen.io/anon/pen/jEPYRq

Answer 1

[zjoin]

Я внутренним элементам ставлю min-height
aside { min-height: 100% }

Comments

[Discout]

Большое спасибо, помогло. А почему просто height не работает?

[zjoin]

Как видишь. Inner элементам мы говорим занимать минимальную высоту их родителя.

Answer 2

[Илья Колин]

section {
height: 100vh; /* высота секции равна высоте области просмотра */
}

Answer 3

[klenovnn]

Если меню фиксированное слева, ставим ему position: absolute
Затем задаем height: 100%. Еще для избежания мелких багов (изменение масштаба, скролла в iOS, MacOS (когда при скролле можно все элементы сдвинуть и увидеть чистый фон)), а бы еще фиксированный черный фон картинкой по вертикали сделал слева (для body задать).