Доверьте продвижение нам
теги:

Категории

Рубрики

Профессиональная разработка сайта для вашего бизнеса. Качественное создание и продвижение веб-сайтов. Осуществляем полный цикл услуг.

от

Настройка рекламного кабинета Яндекса под различные стратегии и масштабы.

от

Как footer прижать к низу CSS

Есть несколько способов прижать footer к низу страницы с помощью CSS:

  1. Использование абсолютного позиционирования:
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
}
  1. Использование флексбоксов:
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main {
  flex: 1;
}

footer {
  margin-top: auto;
}
  1. Использование гридов:
body {
  display: grid;
  grid-template-rows: 1fr auto;
  min-height: 100vh;
}

main {
  grid-row: 1 / span 1;
}

footer {
  grid-row: 2 / span 1;
}

В каждом из этих примеров footer будет прижат к низу страницы. Выберите тот, который лучше всего подходит для вашего проекта.

Поделиться:

Комментарии

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Задать вопрос

Оставляя заявку, вы соглашаетесь с политикой обработки персональных данных.

Оставить заявку

Оставляя заявку, вы соглашаетесь с политикой обработки персональных данных.