Web browsers ship with a set of default styles that are applied to every web page in what is called the user agent stylesheet. Most of these styles are consistent across all user agents. However there are some inconsistent styles like header padding, button border, line height, display mode, font size and margin, etc.
So how serious is the problem of inconsistent default styles? It depends on browser versions you target (the older the worse) and your expectation on consistent styles across browsers.
CSS resets refer to any solutions that fix above problem. Those solutions can be categorized by the way they touch browser default styles — resetting, normalizing, and personalizing.
They try to achieve a combination of following tasks but different in degree of how much aggressive and opinionated they override default styles:
CSS resets can save you a lot of time matching a duplicate experience for each web browser. Just keep in mind these resets may not be necessary for every website and you should begin to understand the purpose of individual CSS libraries over repeated use.
Resetting is a very aggressive approach that wipes out all browser default styles and lets you start from scratch. It imposes a homogenous visual style by flattening everything, all HTML tags will have no padding, no margin, no border, same font-size and same alignments.
These resets are intended to be used as a starting point, not a self-contained black box of no-touchiness.
Meyerweb’s reset - was created more than 10 years ago, intentionally very generic. It should be tweaked, edited, extended, and otherwise tuned to match your specific reset baseline.
minireset.css - a tiny modern library that resets font sizes, resets block margins, resets tables, preserves the inline padding, sets the border-box box sizing, etc.
Normalizing is a modern approach that retains useful default browser styles. When an element has different default styles in different browsers, it aims to make those styles consistent and in line with modern standards when possible.
Normalizing is way better than resetting:
Normalize.css - The most popular, modern, HTML5-ready CSS reset library in this category. It normalizes styles for a wide range of elements, corrects bugs and common browser inconsistencies, improves usability with subtle modifications, and explains what code does using detailed comments.
Modern-normalize - It’s a port of Normalize that, as the name suggests, is modernized to remove some of the older stuff and add a few opinionated bits.
Personalizing is an approach that built upon previous approaches by resetting or normalizing default browser styles first, then add some opinionated base styles which suit a unique need or follows a design system.
Resetting is not efficient and deprecated. Normalizing makes elements look consistent across browsers and it does it well, but it does not remove the user agent’s assumptions about how things look. Personalizing provides a rich ready-to-use highly-opinionated baseline.
sanitize.css - A reset library developed alongside and synced with normalize.css, which means every normalization is included, and every normalization and opinion are clearly marked and documented.
Reboot.css - A reset file designed for Bootstrap framework, built upon normalize.css, provides many HTML elements with somewhat opinionated styles using only element selectors, additional styling is done only with classes.
There is no absolute right or wrong answer when it comes to CSS resets. Each developer will have their own opinionated decision on which gets the job done. My favorite approach is to include normalize.css untouched and build upon it, overriding the defaults later in my CSS if necessary.