Monday, May 16, 2011

Using a css reset

After seeing that a lot of people at work don’t use a css reset I want to address the subject.

I highly recommend using a css reset purely for the reason that it makes your life a little bit easier, when developing a cross browser site.

While developing apage and building it div by div paragraph after paragraph we start to see little differences between all of our browsers.
The reason for that is that different browsers give different default styles to html elements.
That’s very annoying for us.
So the first thing I recommend doing is putting a css reset on your site while starting to develop. it can save you a lot of time and css attributes
because in the end while developing you in fact do override the browser's default style settings for element. But.. it takes you more time to find those places (thank god for firebug)
and… You are writing all kind of attributes like: margin:0px; padding:0px; in a lot of your classes.

So that’s exactly what a css reset does, it overrides those default style settings and then you can start off fresh.

There are css reseters out there but I think the two most common are:
YUI css reset,
and a css reset by erik meyer.
I use erik's css reset for quite some time and its great.

You can download them here:

YUI css reset

Erik meyers

For already developed sites:
I wouldn't recommend to just add a css reset file to your site unless you are willing to spend the time required to go over all of your site with all the browsers and check to see that the css reset didn’t destroy anything…

In conclusion:
Don’t get me wrong this is not some kind of magic trick for building cross browser websites
you will still have annoying problems of course. But surely there will be less. And at least it saves us some time.






No comments:

Post a Comment