RIP px, Sekarang eranya REM dan EM
Oktober 08, 2020Kenapa jangan Pixel?
karena pixel tiap device itu berbeda, pixelnya web lebih besar dari pixelnya mobile. dulu saat pertama belajar web kita sering menggunakan px sebagai acuan untuk ukuran, namun semenjak adanya mobile dengan pixel yang lebih tinggi dari komputer membuat px tidak cocok dipakai sebagai ukuran. Contoh lain juga karena di beberapa browser ada fitur untuk mengubah ukuran font. kalau kita menggunakan px maka ukuran padding atau margin yang menggunakan px tidak akan berubah. Solusinya adalah REM dan EM.
Hai REM
ketika kita mengubah ukuran font pada browser, maka ukuran margin dan padding yang kita set menggunakan REM akan ikut berubah menyesuaikan dengan ukuran dasar dari root font-size.
Berikut adalah contoh bagaimana kita bisa melihat kalau px, rem dan em sangat berpengaruh.
 |
| Setting ukuran font pada Chrome |
Jika ingin pixel kita sama maka kita bisa memaksa Chrome dengan menentukan ukuran font dasar lewat css menggunakan pixel seperti:
{ font-size: 10px; }
{ font-size: 10px; }
// TODO : membuat code pen untuk menunjukan perbedaan px, REM dan EM.
0 komentar