I've seen way worse CSS recommendations, but this still comes across not as a way to write sane, manageable, scalable CSS, but as rules to make working with ins

I've seen way worse CSS recommendations, but this still comes across not as a way to write sane, manageable, scalable CSS, but as rules to make working with insane, unmanageable CSS a little easier. Verbose comments and consistent naming and formatting do not address the underlying causes of CSS hell. The worst CSS practice today that developers insist on shooting themselves in the foot with is the monolithic CSS file. Whether this is one 15,000 line file or 20 smaller ones that are combined at compile time, if you are going to ignore the tools CSS has for limiting the scope of styles and include all styles on all pages you are going to have trouble. The rules I use that work well to manage style sheets are: 1. A primary style sheet should be included on every page, but it should only contain styles for structural elements (header, navigation, footer) and common default content styles. It should only be changed after extensive deliberation and testing. If you have sections of your site that use a completely different template, they should use a different primary file (main_sales.css or something.) 2. If a section of the site uses the same overall template but needs custom content styles, use a secondary style sheet and only include it on the pages that need it. I know that having more HTTP requests hurts performance but 2 includes is not unreasonable for the benefit of controlling the scope of styles. If content styles in a secondary style sheet appear to be useful for all pages, move them to the global style sheet only after proper consideration. 3. Use embedded style sheets. I know you were told this is "bad" and never do it, but have you ever stopped to question why? Coding CSS directly in the HTML is the correct technique if the styles are meant only for the page they are on. If this is the case, embedding styles improve maintainability (no need to hunt for the external style sheet, it’s right there next to the HTML) and performance (no extra HTTP requests.) If embedded styles are judged to be valuable to other pages, move them to a secondary sheet after proper consideration. Including all styles on all pages (what I call the "monolithic style sheet") is a maintenance nightmare because no matter how you comment or name selectors, you cannot predict the side effects of even small changes. Because each page’s layout could be affected differently, every single page must be checked by a person who knows what layout was intended. This is a Herculean task that is not inherently caused by the CSS specification, but by poor architectural choices. Please, for your own benefit, start thoughtfully using secondary and embedded style sheets. edit: I forgot to mention that monolithic styles sheets also significantly hurt performance due to loading and parsing large amounts of unnecessary code.