Пазіцыя

Выкарыстоўвайце гэтыя скарочаныя ўтыліты для хуткай канфігурацыі становішча элемента.

Агульныя каштоўнасці

Класы хуткага пазіцыянавання даступныя, хоць яны не рэагуюць.

<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>