CSS AdvancedLesson 76Preview gratis
CSS Box Sizing
Lesson ini bagian dari CSS · Semua level
Ringkasan
Model `box-sizing` menentukan apakah `width` yang kita tulis mencakup padding dan border atau hanya kontennya. Secara default, CSS memakai `content-box`, sehingga padding dan border menambah lebar total. Dengan `border-box`, lebar yang disetel langsung menjadi ukuran akhir kotak sehingga perhitungan tata letak jauh lebih mudah.
Poin kunci
- `content-box` (default): width = konten saja, padding dan border menambah ukuran
- `border-box`: width sudah termasuk padding dan border
- Nilai total `border-box` = nilai `width` yang ditulis
- Banyak proyek mengatur `* { box-sizing: border-box; }` agar perhitungan konsisten
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.