Reset CSS

note from Mon Oct 26, 2015

Default values for CSS margins and padding vary from browser to browser. To help add a layer of predictability in layout to stylesheets, I always zero-out a base set of attributes for the core elements. Here is the basic reset css that I use to start all my web projects. There are probably other values that are worth resetting to zero or other defaults, but these are the ones that I find take care of 99% of cross-browser layout issues.

html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p {
  margin: 0;
  padding: 0;
}

img, body, html {
  border: 0;
}

address, caption, cite, code, dfn, var {
  font-style: normal;
  font-weight: normal;
}

ol, ul, li {
  list-style: none;
}

caption, th {
  text-align: left;
}

Tip

It would also be worthwhile to explicity set the "line-height" attribute in your main CSS file.

CSS and Responsive

Here are two references for learning about CSS and responsive web design. (As you can see, I'm quite preferential towards the O'Reilly books. I really think most of them are top-quality.)

If you have a Kindle (or a Kindle reader) you can download this for free from Amazon. It's actually a pretty good foundation for anyone who wants to know CSS.