Why I don't like reset stylesheets

Sometimes it’s hard to tell the difference between an idea that’s bad an idea that’s just different. Reset stylesheets have been one of those ideas for me but after working on a couple of different sites that use them I’ve decided I personally don’t like them.

The idea of a reset stylesheet is to strip the default style out of a webpage before you start to apply your design. This gives a predictable base for you to start with and removes browser inconsistencies with the default styles. There are a number of different reset stylesheet options. The most popular ones are from Eric Myer and YUI.

Sounds like a great idea in theory. Slight browser inconsistencies (particularly with margins and padding) are a pain to remember and can really mess up a design if you don’t test in multiple browsers.

Why set the styles and then set them again?

The big problem I have with it is how redundant it can be. The way I’ve seen reset stylesheets implemented is you include a reset stylesheet to reset everything to empty (including things like removing bold text from the <strong> tag) and then you create another stylesheet where you set all the styles that you want in the page.

It feels pretty redundant to have to set styles like bold text on the <strong> tag or numbered bullets on the ordered list. Most of the defaults make a lot of sense and most of them are pretty consistent between browsers.

It also feels kind of redundant to have the browser have to download and apply the reset styles and then download and apply the real styles. I haven’t actually ever seen a reset hurt the rendering time of a webpage but I have worked on a few sites where the number of requests that the browser was making became a problem and having the reset stylesheet as a separate request didn’t help.

Why make me learn what the base styles are again?

The other thing I don’t like about it is that the browser no longer acts the way I’d expect. I’ve got years of experience with how browsers render things and usually can picture in my head what a style should do to a page. Adding a reset stylesheet means that it’s not as intuitive any more.

A better solution?

I think a better solution would be using a stylesheet like YUI base that makes browser defaults the same across different browsers as a starting point for your own stylesheet and then adding your own styles for the particular site. I don’t think I’d even bother setting a default style and then overriding, I think I’d prefer to just set the style once.

I think using something like the YUI base as a starting point is a great idea, but I think if I was going down this path I’d want to customize it as a I worked to make my own version to use on other sites.

A tool I don’t like, but something worth thinking about

Eric Myer’s response to people questioning whether reset stylesheets were a good idea or not was pretty much, use them if you find them useful and or don’t otherwise. I just wanted to put my hand up as not personally liking them (since they seem to be every at the moment) in the hope of making other people question them too.

Posted on 23 Aug 09 by Helen Emerson (last updated on 23 Aug 09).
Filed under CSS