I'm working on a site that uses a master stylesheet for header, menu, footer and basic content positioning as well as typography.
However, the site has about six variations on content layout depending on where you are in the site.
Right now I'm importing the master style sheet and then importing any unique styles for a particular layout that override declarations in the master style sheet.
I'm trying to use as few classes as possible and get by with my basic element selectors, so I'd rather not have something like #layout1, #layout2, #layout 3, etc.
I'm using an ID selector on the body tag to switch content in the menus and I've thought about doing the same thing to switch layouts depending on the body's ID, but honestly I think it's unnecessary.
Also, the various layouts will eventually be turned into templates for use in Contribute so I think it makes more sense to keep the specific CSS tied to each layout. I'd like to import the style to avoid low-brow incompatability.
I'm just wondering if there's a smarter way to do this. Am I shooting myself in the foot?
Well the answer is really what works best for you and makes your job easier .
I prefer to work with one file so that I don't have to look anywhere else but a lot of people prefer to break the styles down into separate files for the different layouts and then just import the seprate file on the relative pages.
If your master file holds most of the styles then there won't be much delay in importing the changes. The advantage (or disadvantage) of one stylesheet is that it gets loaded and cached straight away and is ready for use throughout the site without re-loading.
I think using the body id is a good way to change layout specific to that page and is reasonably easy to manage and gives you the flexibility of having the styles applied only to the page concerned.
Other than that it does boil down to choice and personal working practices etc.