Architecting CSS : Comments
July 18, 2005
Great article, and long overdue.
When I create my style sheets, I like to organise my styles in the order that the elements appear in the XHTML. This places the header styles at the top, the navigation next in line, then the content, then the footer etc.
This way, it’s quick and easy to navigate through the style sheet to find a particular style. I don’t need to know the name of the section it lives in, I just need to know where it is on the page.
Another thing we’ve started to play with, is to group our style sheets by the type of styles in them. We have a style sheet for layout, one for fonts, one for link styles etc. This allows other developers to know exactly which style sheet they need to work in. It also prevents someone from altering the layout when they only need to be changing a couple of font colours. This is particularly useful if you have several developers working on a large site as it makes asset management a little easier (only certain memebers of the web team could be given permission to edit the layout style sheet for example).
One last point (and this relates more to XHTML than CSS but is still relevant) – when we create a div with a class or ID, we always put a comment after the closing div to state which div it closes. It makes it easier for other developers to go through the code and add elements into the right place.