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
akash devgan
2,312 PointsWhy we don't put responsive.css before main.css ??
I am learning web designing and came across responsive web design but i saw instructor put responsive.css after main.css and i think it should come before main.css
2 Answers
Kristopher Van Sant
Courses Plus Student 18,830 PointsCSS means cascading style sheets, and this rule applies not just to what's in the css files but how they're placed in the head section as well. responsive.css comes after because it will change what's happened in main.css. Put simply "The one defined last wins" as mentioned here http://stackoverflow.com/questions/30740426/how-does-a-browser-choose-which-style-sheet-to-use?lq=1 and here http://stackoverflow.com/questions/9459062/in-which-order-do-css-stylesheets-override
For a deeper understanding you can checkout cascading order being described here http://www.w3.org/TR/2011/REC-CSS2-20110607/cascade.html#cascade
Liam Maclachlan
22,805 PointsNice catch man. I agree with your point and it may be corrected on a later video, if it starts to conflict with the styles in main.css. Base styles should be first (grids, universal stylings etc) and the themes styles should be after.
akash devgan
2,312 PointsThanks for responding
Liam Maclachlan
22,805 PointsLiam Maclachlan
22,805 PointsI understand, agree and see your point but I also think that base styles (like responsive grids) should be put before the main styles, so they can be overwritten if need be. In this context (depending on the actual content of main.css), really responsive should be first in the styles stack order.
Kristopher Van Sant
Courses Plus Student 18,830 PointsKristopher Van Sant
Courses Plus Student 18,830 PointsThank you for adding further to this, there are definitely other ways of doing things. I was assuming (and maybe incorrectly so) they were referring to the responsive web design section in the web design course. In that particular case the file main.css holds the majority of the CSS and all base styles, and the responsive.css file uses media queries to adjust the styling that was previously declared in main.css. So for this use case I believe then it's appropriate for responsive.css to come after main.css.
Liam Maclachlan
22,805 PointsLiam Maclachlan
22,805 PointsAh. Didn't check it myself but that totally makes sense.