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 trial

CSS

Difference between main.css and normalize.css

What are the different uses for the two different css documents? For normalize.css, I know you apply the baseline styles to the site, but what is main.css used for? During my tutorials, I was instructed to use main.css, normalize.css, and responsive.css. I want to know what styles to apply to each.

Hi, Nikki main.css is where you write you css for you webpage and Normalize is to make everything to 0

1 Answer

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,254 Points

Hello Nikki,

I don't think main.css and responsive.css do anything in particular.

main.css - sounds like a place you'd put your main styles in, so for elements common to all pages on your website. responsive.css - would be a good stylesheet to put your media queries in. So these are style rules that override other styles so you can make pages that look good on mobiles/tablets and other devices.

What normalize.css does is provide a pre-set stylesheet that resets paddings, margins, borders and other styles to defaults so your website looks the same on all major browsers. It clears up all sorts of cross browser inconsistencies so you don't have to worry about them too much before you start your project.

I hope this helps clear it up :)