Ask HN: Anyone have a really smart way to organize css?
Natalie Downe, my co-founder, has a very neat technique for organising CSS which she calls a CSS System. She described it in this talk:<p><a href="http://lanyrd.com/2008/barcamp-london-5/sg/" rel="nofollow">http://lanyrd.com/2008/barcamp-london-5/sg/</a><p>She splits everything in to general styles (basic HTML elements), helper styles (things like forms, notifications, icons), page structure (header, footer, layout columns etc), page components (reusable composable classes for components that occur on different pages in different combinations, such as a news teaser) and over-rides (special cases for individual pages, rarely used).<p>She hardly ever uses IDs, preferring classes for almost everything - because CSS written against classes can be used more than once on a page.<p>She uses CSSEdit's groups feature to make the CSS easier to navigate - it's all in one file. <a href="http://macrabbit.com/cssedit/" rel="nofollow">http://macrabbit.com/cssedit/</a><p>View the stylesheets on <a href="http://lanyrd.com/" rel="nofollow">http://lanyrd.com/</a> and follow the link at the top to the unminified version to see annotated examples.