Order or Chaos?

When a project grows, CSS turns into a huge tangled mess. One !important spawns another, and changing a button color in one place breaks layout on another page.

Main Scalability Enemies:

  1. Global styles: when you change div or p globally.
  2. Too long selectors: header nav ul li a.active — this is hard to read and maintain.
  3. No system: when each developer names classes however they want.

Solution: Using naming methodologies and clear file structure.