Положение

Утилиты позиционирования помогут вам разместить компоненты вне обычного их положения.

Fixed top

Размещает элемент в верхней части окна просмотра, от края до края.

<div class="fixed-top">...</div>

Fixed bottom

Размещает элемент в нижней части окна просмотра, от края до края.

<div class="fixed-bottom">...</div>

Sticky top

Помещает элемент в верхней части экрана, но только после прокрутки. Модификатор .sticky-top использует CSS стиль position: sticky, который поддреживается не всеми браузерами.

<div class="sticky-top">...</div>

Абсолютное позиционирование

Имена классов присваиваются с использованием формата a{side}-{size} для xs и a{side}-{breakpoint}-{size} для sm, md, lg, и xl.

Где sides является одним из:

• t - для top (верхней стороны)
• b - для bottom (нижней стороны)
• l - для left (левой стороны)
• r - для right (правой стороны)

Где size является одним из:

• 0 - смещение отсуствует.
• 1 - смещение на .25 rem
• 2 - смещение на .5 rem
• 3 - смещение на 1 rem
• 4 - смещение на 2 rem
• 5 - смещение на 4 rem
• 6 - смещение на 8 rem
• 7 - смещение на 16 rem

Для отрицательного смещения вы можете использовать следующую конструкуию {a}{sides}--{size} для xs и {a}{sides}--{breakpoint}-{size} для sm, md, lg, и xl.