Как задать позицию в CSS

Для задания позиции элемента в CSS используются свойства position, top, right, bottom, left.

Свойство position определяет тип позиционирования элемента. Возможные значения:

  • static (по умолчанию) – элемент позиционируется в соответствии с обычным потоком документа;
  • relative – элемент позиционируется относительно своего обычного положения в потоке документа;
  • absolute – элемент позиционируется относительно ближайшего позиционированного родителя (если такой есть), иначе – относительно body;
  • fixed – элемент позиционируется относительно окна браузера и остается на месте при прокрутке страницы.

Свойства top, right, bottom, left задают расстояние от соответствующей стороны элемента до соответствующей границы родительского элемента (или окна браузера для элемента с position: fixed).

Примеры:

/* Позиционирование элемента в правом верхнем углу */
.element {
  position: absolute;
  top: 0;
  right: 0;
}

/* Позиционирование элемента внизу страницы */
.element {
  position: fixed;
  left: 0;
  bottom: 0;
}
реклама

Качественный хостинг сайтов

реклама

Получите консультацию нашего маркетолога

Изучит ваш проект, подберет подходящие услуги и тарифы

Получите бесплатный аудит

Наш специалист сделает базовый аудит вашего проекта и предложит персональные предложения.

Закажите услугу Как задать позицию в CSS

Наш специалист свяжется с вами в ближайшее время и уточнит детали