Mengenal CSS Reset

Banyak yang kebingunggan mengapa desain css yang telah dibuat sedemikian cantiknya namun ketika dibuka dengan browser berbeda hasilnya pun juga berbeda, saya sendiri sebelum mengenal tentang css reset juga merasa kebingunggan, karena harus menyesuaikan margin, padding pada semua browser, memang bisa namun akan sangat memerlukan waktu.


Perbedaan ini dikarenakan pada masing-masing browser memiliki style defaultnya sendiri, setelah itu saya browsing kesana kemari sampai menemukan artikel yang membahas tentang css reset dan mereferensikan ke website w3school. Ternyata mudah saja membuat sebuah css reset sendiri seesuai kebutuhan, berikut akan saya singgung sedikit saja tentang css reset yang sering menjadi kendala dalam pengembangan desain web.

Sebelum berkembangnya css reset ini, developer sering menggunakan css berbeda dalam setiap browser, berikut contoh css reset sederhana yang sering saya gunakan.

css Reset

html, body, header, div, aside, footer {
margin: 0;
padding: 0;
}

Code diatas dimaksudkan saat pertama kali bagian-bagian itu dideklarasikan pada tag html, kondisi awal untuk margin dan paddingnya adalah 0 untuk semua browser, jadi jika kita ingin menambahkan style margin / padding pada bagian tertentu tinggal dideklarasikan pada bagian cssnya masing-masing, contohnya :

Penerapan

header {
position: relative;
background: #fbfbfb;
margin: 5px;
font-family: Oswald, Sans-serif;
}

Seperti itulah penggunaan css reset, untuk selanjutnya tinggal pengembangan, tentu saja sesuai kebutuhan masing-masing. Semoga bermanfaat.

{ 0 komentar... read them below or add one }

Posting Komentar