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

How do you structure your CSS file(s)?

I'm working on the biggest project to me, so far, and I'm using a few tips from the SMACSS and OOCSS approach. However, the way the files are structure with SMACSS consider you have javascript in mind, when it goes to changing states.

I'm not saying I don't want to consider javascript, but I want to structure my CSS files even before that. Plus, I'm not sure what to consider outdated (if any).

Combining it with the way concepts are presented at the CSS course here and a post from Dave Rupert's own website, where he writes about delivering 'modules, not pages', I'm thinking of going with this:

  • Base
  • Layout
  • Module
  • State
  • Typography
  • Media Queries

Any suggestions?

2 Answers

Nothing wrong with that. I would only separate Media Queries into a different file. Something like mobile.css or responsive.css. Fonts I always load on top of the file.

Michael Alaev
Michael Alaev
5,415 Points

I use the smacss approach. it just makes easier to handle the css files for me.