Flex Bootrap

Panduan Singkat Bootstrap Flex

Apa itu Bootstrap Flex?
Bootstrap Flex adalah fitur dalam kerangka kerja Bootstrap yang menggunakan CSS Flexbox untuk mengatur tata letak elemen secara responsif dan fleksibel. Fitur ini memudahkan pembuatan desain yang dapat menyesuaikan tampilan di berbagai ukuran layar.

Keunggulan Bootstrap Flex

Responsif: Layout otomatis menyesuaikan dengan ukuran layar (desktop, tablet, smartphone).
Fleksibel: Mudah mengatur arah, ukuran, jarak, dan penjajaran elemen.
Praktis: Bootstrap menyediakan kelas CSS siap pakai, mengurangi kebutuhan menulis kode manual.

Kelas Utama dalam Bootstrap Flex

d-flex: Mengaktifkan Flexbox pada elemen.
Arah Elemen:
- flex-row (default): Elemen disusun horizontal (kiri ke kanan).
- flex-row-reverse: Horizontal (kanan ke kiri).
- flex-column: Vertikal (atas ke bawah).
- flex-column-reverse: Vertikal (bawah ke atas).
Penjajaran Elemen (justify-content):
- justify-content-start: Elemen ke kiri.
- justify-content-end: Elemen ke kanan.
- justify-content-center: Elemen ke tengah.
- justify-content-between: Ruang rata di antara elemen.
- justify-content-around: Ruang rata dengan jarak di tepi.
- justify-content-evenly: Ruang rata sepenuhnya.