Which HTML5 reset CSS do you use and why?

Darryl Hein picture Darryl Hein · Aug 15, 2010 · Viewed 91.4k times · Source

Which HTML5 reset CSS do you use and why? Is there one that you've found to cover more cases?

I've started using HTML5 Doctor's: http://html5doctor.com/html-5-reset-stylesheet/ It seems to work, but I'm wondering if there is something better out there.

Answer

frontsideup picture frontsideup · Apr 1, 2012

Real talk: Despite the markdowns kaikai is right, you only need to reset *padding & margin to 0.

Though unfortunately 99% of us do not have resources or man power to keep up with the hundreds of browser versions out there. So a reset sheet is essential for the typical website.

html5reset: (It's too interfering)

I just took a look at http://html5reset.org/

img,
object,
embed {max-width: 100%;}

And:

html {overflow-y: scroll;}

I understand it has good intentions but, that's not the job of a reset sheet. It's making too many assumptions.

BluePrint Reset:(literally a blueprint)

body {
  line-height: 1.5;
  background: white;
}

Whats up with 1.5. And why background white?(I know it's for correcting but still not necessary)

Normalize.css: (Not normal)

https://github.com/necolas/normalize.css/blob/master/normalize.css

It started good with some webkit/ie hacks but

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

h2 {
    font-size: 1.5em;
    margin: 0.83em 0;
}

h3 {
    font-size: 1.17em;
    margin: 1em 0;
}

h4 {
    font-size: 1em;
    margin: 1.33em 0;
}

h5 {
    font-size: 0.83em;
    margin: 1.67em 0;
}

h6 {
    font-size: 0.75em;
    margin: 2.33em 0;
}

Every header tag is targeted. & they don't reset the line-height of the body.

I'm sure all the above does the intended job well, but will probably be overridden more than necessary.

Eric Meyer

YUI

HTML5Boilerplate

The above are more for pros with Boilerplate leaning to the (over friendly) side I'm sure due to popularity. At the moment 80% of my customized reset is boilerplate.

I'm going to go though all three bit by bit and make my own, it's not rocket science.