Should I use a CSS reset?

A CSS reset is a tool that reconciles the differences in rendering between different browsers. In the old days, each browser was its own beast. They each came with their own default styles. Internet Explorer had different rules for your un-styled H1 tags vs Chrome or Firefox. Every browser set their defaults to what they thought was a good starting point. There were no predefined rules that they all followed. It was more of a culture than a standard. Fast forward to today, and each web browser had complete overhaul. Yet we see more consolidation.

In 2020, you can safely run the JavaScript code document.querySelectorAll without worrying that it will fail on your browser. jQuery, the library that inspired great improvement to web browsers, is no longer needed. Most functions that it used are now natively supported. Similarly, you can safely use the border-radius property in your CSS without thinking about backward compatibility. Most if not all browsers will render it correctly. So the question comes to mind: is there a good reason to use a CSS reset?

CSS resets may have started as a way to reconcile the differences between browser rendering, but I still find them useful today. You may think you don't need them because you are using a CSS framework like Bootstrap, Bulma, or Pure.css. But open the source code and you will find that all your H1 tags are getting a margin: 0.

There are still some slight differences between margin, padding, or line-height between different browsers, but nothing as drastic as before. The reason I still use a CSS reset is to have a good starting ground. Before I start styling any HTML page, I include a modified copy of the meyerweb reset. It gives me a blank slate where I can build a page and style it to pixel perfection. I don't have to worry about my H1 tag having 0.83em margin and tweaking it to be slightly larger than that of an H2. I start with zero and set it to what I want.

The difference between pages rendered in different browsers without a CSS reset is not as drastic as it once was. However, the reset still gives us a good starting ground to emulate any layout style we want to achieve without thinking about the browser. The reset makes your life easier.