Tips CSS Global Reset : Solusi Perbedaan Margin Padding di Setiap Browser

Masalah utama dalam mendesain atau mengedit sebuah template adalah tidak standarnya antara browser satu dengan browser lainnya dalam menilai sebuah value dari tag HTML. DI Mozilla baik-baik saja, tapi kalau di explorer kok jadi berjarak sekian pixel.

Beberapa tag yang memiliki value berbeda pada setiap browser adalah Heading <h> , List <ul, ol, li>, Paragraph <p>, blockquote <blockquote>, dll.

Untuk mengatasinya adalah dengan cara men setup awal dengan cara "Global Reset" yaitu dengan memberikan aturan yang menyamakan semua perbedaan pada masing-masing browser. Yaitu dengan menambahkan:

/* CSS Document */
* {
padding: 0;
margin: 0;
}


Dengan demikian semua margin dan padding akan di reset menjadi 0px. Sehingga anda perlu mengatur kembali margin dan padding pada setiap elemen:

h1 {
font: normal 18px Arial, Helvetica, Sans-Serif;
margin: 4px;
padding: 4px;
}

Kesimpulan dari artikel ini adalah dengan global reset maka akan memudahkan mengatur margin dan padding disetiap browser.