How to setup/install Normalize.css manually and with CDN.
Article have related YouTube video
For a web developer normalize.css is almost an essential part of creating a website from scratch. Remove all unnecessary margin, padding and so on from the default way browsers are doing it. Normalize.css also corrects a lot of small bugs in the browsers and have even more benefits.
Different ways to use normalize.css
If you want to reset the default browser CSS values, you should use normalize.css. There is 2 ways you can use normalize.css. The first way is to include the normalize.css file to your project and then just edit that file when you need to change any styling. The second way is to use normalize.css as the first loaded stylesheet on the website and then make your own .css file to override the normalize.css.
The normalize.css file is only approx. 350 lines of css code (v8), so the first way of doing it could make sense, however the most common way to use it is the second way.
The CDN setup
Use cdnjs.com to find the newest version.
Paste this code in your <head> tag above all your own css link tags.
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
Setup manually
- Go to the official normalize.css website and click the big ‘download’ button.
- On the raw coding-page you get directed to, hit ctrl+a to mark everything and then copy/paste it into your text editor in an empty file.
- Save this file as normalize.css in your css folder in your project (doesn’t matter what you call it, but for best practice stick to the actual name.)
- Go to the file in your project where your <head> tag is and put this code snippet above all your other css links.
<link rel="stylesheet" type="text/css" href="css/normalize.css">
Is normalize.css future proof?
Of course, there is no guarantee that normalize.css will be working 100% in 5 years, HOWEVER my guess is that it will. All updates are up to the developers and the community around normalize.css who can participate in finding bugs and creating issues on the project on GitHub. Every time a new browser update become available, the creators of normalize.css must check if everything is still working properly in the normalize.css file, else they must update it with a fix. In the last 11 years approx. 500 issues have been created and 450 of them is solved, so I would evaluate the project to be pretty stable what updates concerns.
Like what you see?
