Как растянуть div по вертикали ровно до конца экрана?

Question

[EvgMul]

Здравствуйте.
Стоит следующая задача.
Есть на странице div. Он должен обладать следующими свойствами:
1. Его высота должна растягиваться ровно до видимости экрана.
2. Если содержимое этого дива превышает его высоту, то должен появляться скролл.
Подскажите пожалуйста, как это реализовать?
Заранее благодарен всем отозвавшимся.

Answer 1

[Константин Самсин]

Ссылка на пример
А если в двух словах:

height: 100vh;
overflow: auto;
overflow-x: hidden // чтобы убрать горизонтальный скролл

Comments

[EvgMul]

Огромное спасибо, то что нужно. А не подскажете еще, можно ли в sass сделать что-то типа 100vh - 50px? У меня 50 пикселей занято на хедер и нужно их как-то вычесть.

[Константин Самсин]

height: calc(100vh - 50px)

[EvgMul]

Константин Самсин: круто, то что нужно. Спасибо огромное!

Answer 2

[Олег]

https://jsfiddle.net/joomla/c06qnz0m/