Posisyon

Gamita kini nga mga shorthand utilities alang sa dali nga pag-configure sa posisyon sa usa ka elemento.

Komon nga mga mithi

Ang mga klase sa dali nga pagpoposisyon magamit, bisan kung dili sila mosanong.

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

Giayo nga tumoy

Ibutang ang usa ka elemento sa ibabaw sa viewport, gikan sa ngilit ngadto sa ngilit. Siguroha nga imong nasabtan ang mga sangputanan sa natudlong posisyon sa imong proyekto; tingali kinahanglan nimong idugang ang dugang nga CSS.

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

Giayo nga ubos

Ibutang ang usa ka elemento sa ubos sa viewport, gikan sa ngilit ngadto sa ngilit. Siguroha nga imong nasabtan ang mga sangputanan sa natudlong posisyon sa imong proyekto; tingali kinahanglan nimong idugang ang dugang nga CSS.

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

Malagkit nga ibabaw

Ibutang ang usa ka elemento sa ibabaw sa viewport, gikan sa ngilit ngadto sa ngilit, apan human lang nimo kini i-scroll sa ibabaw niini. Ang .sticky-toputility naggamit sa CSS's position: sticky, nga dili hingpit nga gisuportahan sa tanan nga mga browser.

Ang IE11 ug IE10 mag-render position: stickyisip position: relative. Ingon niana, giputos namon ang mga istilo sa usa ka @supportspangutana, gilimitahan ang pagkapilit sa mga browser lamang nga makahimo niini sa husto.

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