0

I have a layout with a header, a navigation pane on the left, and a content pane on the right. The content pane is a pure white background, and I would like to apply an entirely different set of styles to it than the other two panes.

Is there a way to apply a style sheet to the div of the content pane, without having to resort to putting #content in front of each and every one of my css classes in the "content" css file? Or is putting #content in front of each class the correct way to do it?

Robert Harvey
  • 178,213
  • 47
  • 333
  • 501

2 Answers2

1

Putting #content in front is the right way.

The only way to apply a whole stylesheet to a single element without using selectors would be to put it into an IFrame, which would cause a heap of other problems.

Pekka
  • 442,112
  • 142
  • 972
  • 1,088
  • That's too bad. It means the style sheet can't be genericized; i.e. I would have to strip #content from the sheet to use it anywhere else. – Robert Harvey Nov 18 '09 at 18:59
  • 1
    Class selectors are the way to go to generalize rules.To be able to use everything you need in every place is a question of clever planning - I find that sometimes harder than it looks at first sight. I had a similar question a few days ago: http://stackoverflow.com/questions/1731555/reset-css-for-a-certain-area-of-the-page – Pekka Nov 18 '09 at 19:02
  • I like the *idea* of a reset css, but **yikes.** It's the nuclear option. I think I'll go with the #content selectors. Thanks for the tips. – Robert Harvey Nov 18 '09 at 19:08
  • The reset CSS may be daunting initially, but as you use it you realize you're no longer dealing with a lot of the "IE has 3 extra pixels here" issues. – ceejayoz Nov 18 '09 at 19:17
1

This is a little wacky, but if your page is dynamic, you could inject a compressed stylesheet directly into the style attribute of the element.

Josh Pearce
  • 3,399
  • 1
  • 23
  • 24