Как сделать что бы Footer всегда был в внизу, но не фиксированным?

Question

[Demigodd]

Position: relative не прикрепляет элемент к внизу, Footer просто висит в воздухе.
Position: absolute таже история, только эффект получается когда появляется прокрутка на странице.
Ну а Position: Fixed не подходит, потому что каждый раз при прокрутке он всегда виден на экране.

Ссылка на JsFiddle

Так как же прибить Footer в самый низ экрана, и что бы он всегда был там при любом разрешений экрана, при изменений Zoom`а и т.д.

Answer 1

[Антон Спирин]

Простой пример.

Answer 2

[Даниил Попов]

Относительно вашего примера:

Оберните всё в блок и присвойте ему два свойства

position: relative;
height: 100%;

А для того чтобы избежать пробела снизу при высоком экране и недостатке контента, добавьте еще

min-height: 100vh;

https://jsfiddle.net/groog/e30nchas/16/

Comments

[Антон Спирин]

Про отступ для контента еще забыли. Если его не добавить, то контент будет под футер залазить.

[Даниил Попов]

Антон Спирин, разумеется