MoreLesson 209Preview gratis
Clearfix
Lesson ini bagian dari How To · Semua level
Ringkasan
Clearfix adalah teknik untuk membuat kontainer tetap membungkus elemen anak yang memakai float. Karena float mengeluarkan elemen dari alur normal, tinggi kontainer bisa kolaps menjadi nol. Solusi klasiknya adalah pseudo-element ::after yang diberi clear: both, sedangkan solusi modern dapat memakai display: flow-root.
Poin kunci
- Float membuat elemen keluar dari alur normal sehingga induk bisa kehilangan tinggi
- Clearfix ::after dengan content: '' dan clear: both memperbaiki hal tersebut
- display: table atau block pada pseudo-element membantu konsistensi
- Alternatif modern adalah display: flow-root atau flexbox/grid
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.