CSS Reset

December 30, 2011

---

We all know by now that each browser displays elements inconsistently. In an effort to make your website design, layout, templates, etc. more cross-browser compliant, you should first “zero out” these inconsistent elements. Stripping out all of the default values forces you to think about how these elements should display, which ultimately gives you the most control over how all of these elements will look. And isn’t that what a designer wants?

A simple CSS Reset

body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, img, form, fieldset, input, textarea, blockquote {
  margin: 0;
  padding: 0;
  border: 0;
}

A full CSS Reset

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, 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, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
}
table {
  border-collapse:collapse;
  border-spacing:0;
}
:focus {
  outline: 0;
}
body {
  line-height: 1;
  color: black;
  background: white;
}
ol, ul {
  list-style: none;
}
fieldset,img {
  border:0;
}

Full CSS Reset cited from Eric Meyer