Blank Slate
This one’s a pretty easy one. Browsers add a whole bunch of preset styles to your markup. This includes margins, padding, borders and little dots next to your list-items, just to name a few. You can keep those defaults, and where needed, undo them time and time again, or you can reset them to zero before you start working, and include only the styles you want on your elements.
Personally, I like starting fresh, it prevents a lot of headaches and annoyance when creating things like navigation or forms. So, here are two ways you can reset your CSS to zero.
YUI Reset
Yahoo’s User Interface provides you with a reset.css file that you link into your document, before your other styles. It’s a decent reset, and has the benefit of possibly being cached on your user’s computer, if they’ve been to another site that uses it. Here’s what you do:
Normalize
normalize.css is a file that was created by Mike Dunn that I took to using after working with him for a while. It has everything YUI’s reset.css file has, and a few additional resets (like setting text-decoration: none on <a> tags, or removing the outline Firefox adds to your links when you click them).
You can download this normalize.css file here.
Also, instead of creating an extra <link> tag in the <head> section of your document, you can import normalize.css into your main CSS file using the following code.
Just put that at the top of your main CSS file, and make sure to get the path correct.