Posisi

Gunakan utilitas singkatan ini untuk mengonfigurasi posisi elemen dengan cepat.

Nilai umum

Kelas penentuan posisi cepat tersedia, meskipun tidak responsif.

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

Atasan tetap

Posisikan elemen di bagian atas viewport, dari ujung ke ujung. Pastikan Anda memahami konsekuensi dari posisi tetap dalam proyek Anda; Anda mungkin perlu menambahkan CSS tambahan.

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

Bagian bawah tetap

Posisikan elemen di bagian bawah viewport, dari ujung ke ujung. Pastikan Anda memahami konsekuensi dari posisi tetap dalam proyek Anda; Anda mungkin perlu menambahkan CSS tambahan.

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

Atasan lengket

Posisikan elemen di bagian atas viewport, dari ujung ke ujung, tetapi hanya setelah Anda menggulir melewatinya. Utilitas .sticky-topini menggunakan CSS position: sticky, yang tidak sepenuhnya didukung di semua browser.

IE11 dan IE10 akan dirender position: stickysebagai position: relative. Karena itu, kami membungkus gaya dalam @supportskueri, membatasi kelengketan hanya pada browser yang dapat merendernya dengan benar.

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