Can a CSS class inherit one or more other classes?

Question

Is it possible to make a CSS class that "inherits" from another CSS class (or more than one).

For example, say we had:

.something { display:inline } .else      { background:red } 

What I'd like to do is something like this:

.composite  {    .something;    .else } 

where the ".composite" class would both display inline and have a red background

Answer 1

There are tools like LESS, which allow you to compose CSS at a higher level of abstraction similar to what you describe.

Less calls these "Mixins"

Instead of

/* CSS */ 

#header {   -moz-border-radius: 8px;   -webkit-border-radius: 8px;   border-radius: 8px; }  #footer {   -moz-border-radius: 8px;   -webkit-border-radius: 8px;   border-radius: 8px; } 

You could say

/* LESS */ 

.rounded_corners {   -moz-border-radius: 8px;   -webkit-border-radius: 8px;   border-radius: 8px; }  #header {   .rounded_corners; }  #footer {   .rounded_corners; }