Thread: reset.css
View Single Post
Old 17-04-2007, 15:04   #1 (permalink)
pgo
Senior Member
 
Join Date: Jan 2005
Posts: 12,336
reset.css

I recently read Eric Meyers' most recent blog posts:

Eric's Archived Thoughts: Reset Styles
Eric's Archived Thoughts: Reworked Reset
and
Eric's Archived Thoughts: Reset Reloaded

In the final one, he recommends a set of baseline styles for all browsers as follows:

Code:
/* Don't forget to set a foreground and background color on the 'html' or 'body' element! */ 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, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; line-height: 1; font-family: inherit; text-align: left; vertical-align: baseline; } a img, :link img, :visited img { border: 0; } table { border-collapse: collapse; border-spacing: 0; } ol, ul { list-style: none; } q:before, q:after, blockquote:before, blockquote:after { content: ""; }
This is to replace the Yahoo! UI reset.css as well as the ever-popular global whitespace reset: * { padding: 0; margin: 0; }

The advantage of his reset is that you avoid the trickier elements - frames, form inputs and so on - and you cover more ground than just padding and margins.

Discuss.

Last edited by pgo : 01-05-2007 at 15:42.
  Reply With Quote