Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS

Edgar Mantes
Edgar Mantes
9,499 Points

CSS order of styling!

This question is about the organization, or order of styling my HTML via CSS. I was wondering how the professionals order their styles. I have heard the general rule of styling from general to specific details but was wondering if I can get a clear example.

I think what they are trying to get to is style the <header>, the <body>, the <div>'s and/or <footer> first before you go into <h1>, or <p>, etc. But does that mean you code the "block positioning" for header, body, and footer first, then style the text for h1, p, ol/ul, li of each header, body and footer? All while trying to keep the the code D.R.Y. ?

I just want to get some clarification on this topic, and examples please... and tips/tricks if you have any! Thanks!!!!

1 Answer

Ryan Field
PLUS
Ryan Field
Courses Plus Student 21,241 Points

Hi Edgar,

For small, simple personal projects, the best way is probably just to keep it organized by section (such as header, footer, other components, and maybe a miscellaneous section). The reality is, though, that larger projects by web developers for work will probably be done in partials using Sass (my favourite) or some other CSS preprocessor. If you haven't already learned about it, there are some fantastic courses here. It seems intimidating at first, but once you get used to it, you'll never go back. :)

Edgar Mantes
Edgar Mantes
9,499 Points

Thanks Ryan! I haven't gone through any course on Sass just yet but definitely looking forward to it. Just started the front-end web development track. Thanks for your help! you saved me lots of time from doing research on organization. Although I know there is a lot to learn, this will be a great place to start.