A while ago I wrote an article published at Training Connection about using CSS Reset Stylesheets. The article explained what reset styles are, and described two approaches: resetting and normalization. But do you really need them?
Common pros and cons to using reset styles
Like anything, there are pros and cons to both approaches. The biggest benefit is that you have more control over the styles on your site; therefore you have a more consistent look across browser platforms.
Personally, I prefer using normalizing styles rather than pure reset styles. The reason is I just want a consistent appearance to my site, without having to manually style each element. This is the biggest con about reset styles – having to put back what was already there in the first place.
Some other cons about reset styles:
- They often include deprecated or unused elements. This can translate into code bloat and longer loading times.
- Redundant code. Often when a reset style is used, it is simply included in its entirety and then overridden later. While this is intentional, it’s still inefficient, and goes back to the first point about bloat and load time.
Alternatives to reset styles
So what should you do instead of using reset or normalizing styles? First of all, there’s nothing that says you can’t edit the reset styles to create your own custom style. Eric Meyer himself stated as much, saying his reset style “is a starting point, not a self-contained black box of no-touchiness.”
Another option is to not use any kind of reset style at all, and just define the styles you need when the user agent stylesheets don’t cut it. This gives you good consistency without unnecessary code. This in turn helps reduce file size and load times.
So do you really need reset styles or not?
Well, no, you don’t need them. Do I think they’re a good idea? Overall, yes I do. Using a lightweight normalizing style can save you some coding effort. This holds true even when reusing your own custom-built style sheets. Likewise, if your project uses Bootstrap or other frameworks, you’re using their pre-built styles.
Whether you use them or not really comes down to your project needs. Choose wisely, and don’t be afraid to edit and cut bloat from your CSS.