Прижатый футер

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

Существует несколько способов прижать подвал:

• абсолютное позиционирование
• минимальная высота контента равная высоте экрана минус высота футера
• табличная верстка
• css flex
• css grid

Рассмотрим два последних варианта, как наиболее актуальные.

В обоих случаях нам нужно указать высоту html и body 100% и разделить сайт на две части - контент и футер.

css flex

Оборачиваем сайт во flex-контейнер, меняем направление основной оси флекса на вертикальную и указываем margin-top: auto для футера, тогда он отступив на максимально возможное расстояние от контента прижмется к низу.

css grid

Оборачиваем сайт в grid-контейнер, указываем футеру align-self: end и всё.