Altered Aspect – Web Design by Rob MacKay

What is a CSS Reset?

Every browser has a defualt way of rendering HTML.

For example – if you were to create a new file and pop a little HTML in you would see it sets a unordered list with bullets, and indents it,  that it also sets font size to header tags (h1-h6) it defines all the standard stuff.   The browser gets all this from a built in standard run of the mill CSS file which it uses to render your code.

But what’s the problem with that?  Well each browser has its own CSS file, they are all different and so they each do things slightly differently.

The issue is that when you then start plonking your code on top you are working from a foundation of someone elses code and not a blank canvas.  What a CSS Reset does is takes it all back to zero and lets you start at a real blank point with no worries about the default code differences between IE and Safari for example.

Cancelling out the default browser styling gives you more power, and more control over cross browser compatibility.

So a CSS reset is CSS that sits at the start of your self written CSS and flattens the default CSS so you have free reign…. wow that was a strange sentence.

So do it!

Once you have a reset its always good to spend some time customising it for your needs…

You can get resets already made from these sources:

http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/

http://developer.yahoo.com/yui/reset/

Tags: css, reset, tips

This entry was posted on Tuesday, July 28th, 2009 at 3:26 pm and is filed under Tutorial. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.