MoreLesson 268Preview gratis
Split Screen
Lesson ini bagian dari How To · Semua level
Ringkasan
Split screen membagi halaman menjadi dua bagian sama besar, misalnya panel promosi dan panel formulir. Flexbox atau Grid dapat membuat kedua sisi sejajar dengan mudah, lalu media query menumpuknya pada layar kecil. Pastikan tinggi dan padding diatur agar konten tetap nyaman dibaca.
Poin kunci
- display: flex pada container membuat dua panel berdampingan.
- flex: 1 pada kedua panel membagi ruang secara merata.
- Pada layar kecil, ubah flex-direction menjadi column agar panel bertumpuk.
- min-height: 100vh memberi kesan halaman penuh tanpa memotong konten.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.