How do I write maintainable CSS?

Answer 1

You can create a UI style kit that hold all of elements and their various styles as well as the CSS declarations. This way, we can refer back to the class or ID names of each style of the elements. This makes it easier if you are developing with a team.

I also use an organizational system for my CSS. I have page specific CSS under a comment which tells me the page. I keep all of my typography in a typography section and all of my site-wide CSS at the top.

My CSS looks a lot like this:

/**SITE WIDE**/

body{color:#fff;}

/**MAIN NAV**/

.main-nav{color:#000;}

/**TYPO**/

h1{}

h2{}

h3{}

h3.class{}

Answer 2

Comments are your best friend.

And look into any of the CSS template utilities. One that I use is Stylus - http://stylus-lang.com/