Source

Позиция

Използвайте тези съкратени помощни програми за бързо конфигуриране на позицията на елемент.

Общи ценности

Предлагат се класове за бързо позициониране, въпреки че не реагират.

<div class="position-static">...</div>
<div class="position-relative">...</div>
<div class="position-absolute">...</div>
<div class="position-fixed">...</div>
<div class="position-sticky">...</div>

Фиксирана горна част

Позиционирайте елемент в горната част на прозореца за изглед, от край до край. Уверете се, че разбирате последиците от фиксираната позиция във вашия проект; може да се наложи да добавите допълнителен CSS.

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

Фиксирано дъно

Позиционирайте елемент в долната част на прозореца за изглед, от край до край. Уверете се, че разбирате последиците от фиксираната позиция във вашия проект; може да се наложи да добавите допълнителен CSS.

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

Лепкава горна част

Позиционирайте елемент в горната част на прозореца за изглед, от край до край, но само след като превъртите покрай него. Помощната .sticky-topпрограма използва CSS position: sticky, който не се поддържа напълно във всички браузъри.

IE11 и IE10 ще изобразяват position: stickyкато position: relative. Като такива, ние обгръщаме стиловете в @supportsзаявка, ограничавайки лепливостта само до браузъри, които могат да я рендират правилно.

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