Can we include common css class in another css class?

Question

I am a CSS newbie. I am just wondering, is that possible to include one common class into another class?

for example,

.center {align: center}; .content { include .center here}; 

I came across css framework - Blueprint. We need to put the position information into HTML, e.g.

<div class="span-4"><div class="span-24 last"> 

As such, we will place the positioning attribute inside html, instead of css. If we change the layout, we need to change html, instead of css.

That's the reason I ask this question. If I can include .span-4 into my own css, i won't have to specify it in my html tag.

Answer 1

Bizarrely, even though CSS talks about inheritance, classes can't "inherit" in this way. The best you can really do is this:

.center, .content { align: center; } .content { /* ... */ } 

Also I'd strongly suggest you not do "naked" class selectors like this. Use ID or tag in addition to class where possible:

div.center, div.content { align: center; } div.content { /* ... */ } 

I say this because if you do your selectors as broad as possible it ends up becoming unmanageable (in my experience) once you get large stylesheets. You end up with unintended selectors interacting with each other to the point where you create a new class (like .center2) because changing the original will affect all sorts of things you don't want.

Answer 2

In standard CSS, it's not possible to do this, though it would be nice.

For something like that you'd need to use SASS or similar, which "compiles" to CSS.