Yazdığımız css kodları tüm tarayıcılarda aynı sonucu vermiyor olabilir, bunun sebebi internet explorer ın margin değerinin geniş olması safari nin margin değerinin dar olması, diğer tarayıcılara göre google chrome un h1 etiketine uyguladığı padding değeri yani kısacası p a span strong gibi standart etiketlerin (tag) her tarayıcıda farklı margin, padding, line-height, width, height değerlerine sahip olmasıdır. Özellikle internet explorer daki css problemleri deli eder adamı.
CSS imizi yazarken tüm tarayıcılar için bu değerlerin standart olması işlerimizi büyük ölçüde kolaylaştırır, piyasada birçok css reset kodu bulunmaktadır, bunlar arasından en çok kullanılan mayer css reset tir. ama mayer reset body'nin line-height değerini 1 yaptığı için p etiketine ayrıca line-height değeri tanımlamak beni her zaman sıkmıştır. Bu yazıyla kendi yazdığım ve hemen hemen tüm projelerimde kullandığım, birtakım önemli html5 elemanlarını da kapsayan css kodumu paylaşayım dedim, projelerinizde güvenle kullanabilirsiniz, bazen birtakım eksiklikler gördüğümde eklemeler veya çıkarmalar yapıyorum, şimdilik son hali aşağıdaki gibidir.
Projenizin en başına reset.css olarak veya css dökümanınızın en başına ekleyebilirsiniz, iyi çalışmalar.
/* =RESET
===========================================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q,
s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
figure, header, nav, section, article, aside, footer, figcaption
{margin: 0; padding: 0; border: 0; outline: 0;}
.clearfix:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
.clearfix {display: inline-block;}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}
ul, li {padding: 0; margin: 0; list-style: none}
header ,nav ,section ,article ,aside ,footer ,hgroup { display: block; }
/* =RESET
===========================================*/