Position

Use these shorthand utilities for quickly configuring the position of an element.

Common values

Quick positioning classes are available, though they are not responsive.

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

Fixed top

Position an element at the top of the viewport, from edge to edge. Be sure you understand the ramifications of fixed position in your project; you may need to add additional CSS.

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

Fixed bottom

Position an element at the bottom of the viewport, from edge to edge. Be sure you understand the ramifications of fixed position in your project; you may need to add additional CSS.

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

Sticky top

ከዳር እስከ ዳር አንድን ኤለመንትን በመመልከቻው አናት ላይ ያስቀምጡት ነገር ግን ካለፉት በኋላ ካሸብልሉ በኋላ ብቻ። መገልገያው በሁሉም አሳሾች ውስጥ ሙሉ በሙሉ የማይደገፍ .sticky-topCSS ን ይጠቀማል ።position: sticky

IE11 እና IE10 position: stickyእንደ ይሰጣሉ position: relative። እንደዚያው፣ ዘይቤዎቹን በጥያቄ ውስጥ @supportsእናጠቃልላለን፣ ተለጣፊነቱን በትክክል ሊሰሩት በሚችሉ አሳሾች ላይ ብቻ እንገድባለን።

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