What Is a CSS Reset and Why You Should Use One

Learn what a CSS reset is, why it's used in modern web development, and the difference between options like Normalize.css and Modern CSS Reset.

When building a website, you may notice that it does not look the same across browsers. That is because browsers have default CSS styles by default. To work with default CSS styles across browsers you can use CSS resets.

A CSS reset is a collection of CSS styles used to either equalize the styles across browsers or remove them.

Two popular options you can use are Normalize.css and Modern CSS Reset. You can copy this CSS and add it to the top of your file or create a separate CSS file like reset.css to save this code.

For the projects on this website I’ll look to apply this code in a separate file for better clarity on the concepts applied in each assignment. The reset.css file should be added first in your code followed by your CSS file as the browser reads code top down with the CSS lower down having priority.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="reset.css">
    <link rel="stylesheet" href="styles.css">
</head>

As you start getting into frameworks you’ll find that there are other options you can us. You also can create your own if desired.

That is all there is to it. Happy coding!

No fluff. Just real projects, real value, and the path from code to cash — one useful build at a time.

Copyright 2025 Matthew Seiwert