Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialLeon Segal
14,754 PointsWhy put the lists override in normalize and not the user style sheet?
Just a query.
Why put the lists override in normalize.css and not just in style.css? The normalize.css doesn't have any special magic properties that mean putting the code in there does anything different, so I can't see a good reason for putting it in there!
It seems neater to put anything you have written in your own files and keep them separate.
Also, normalize.css might be overwritten later on, especially if using npm or bower.
4 Answers
Guil Hernandez
Treehouse TeacherHey there,
Sure, if you're overriding many of the defaults, you probably should build upon it in your stylesheet. But depending on your project, customizing the normalize.css file you download into your project is OK. The Normalize docs even list customization as one of two common approaches. :)
Jason Anders
Treehouse Moderator 145,860 PointsHey Leon,
One shouldn't be putting anything into the normalize.css
file. This is a file that is included into your HTML either by downloading the file or using a CDN. It is already complete and should not be altered. Its only purpose is to "Normalize" the default styles across the various browsers.
You are correct. Anything you want to style yourself should always be done in your own CSS file(s). These files should also be included in the HTML after the normalize.css
file so that you own styles will, in fact, overwrite the styles in the normalize.css
file.
(edit: line removed)
Hope that helps to clear things up for you. :)
Keep coding!
Chris Conwell
2,268 PointsHow to use normalize.css
Approach 1: use normalize.css as a starting point for your own projectβs base CSS, customizing the values to match the designβs requirements.
Approach 2: include normalize.css untouched and build upon it, overriding the defaults later in your CSS if necessary.
Liam English
3,837 PointsI was thinking the same thing, however - in the tutorial video attached to this page (CSS Reset with Normalize), Guil does that himself at around the 4:25 mark.
Jason Anders
Treehouse Moderator 145,860 PointsHmm???
Well, Liam... I really don't have a reply as to why Guil Hernandez would modify the normalize.css
file? It may be just to demonstrate that you can if you really wanted to.
But, I really don't know why anyone would want to. I don't see a point, when anything you may personally want to "reset" or "normalize," can be done in you own CSS file, it doesn't even have to be in your main.css
.
Plus, if you're using a CDN, you can't alter the file anyways. And, if you alter the normalize.css
file then later update the file (newer version), replace the copy (lost the other one), etc ... all your changes are gone.
So... yeah... ??
:)
Liam English
3,837 PointsThanks for the reply Jason.
I think your point(s) are exactly our original thought at the time of watching the video through.
You've explained it very well for others also :)
Jason Anders
Treehouse Moderator 145,860 PointsJason Anders
Treehouse Moderator 145,860 PointsThanks for replying Guil. :)
I guess I've just never seen the first approach done before, only the second one, so I was unsure as to why.
Leon Segal
14,754 PointsLeon Segal
14,754 PointsThanks for clearing that up - I should've checked the docs myself before posting! :)