How to reuse css class content in another class without copying?

Question

Is it possible to use existing css class as content in another class ?

I mean something like:

Contained in some library:
.class1 { text-indent: 100 }

 I         


        

Answer 1

Yes, it is possoble.

Write:

.class1,.class2 {text-indent:100;}
.class1{color:red;}
.class2{font-size:30px;}

More info here.

Answer 2

It is imposible to do in standard CSS what you are commenting, as there is not pure inheritance.

Despite it doesn't apply with your code restrictions, this is the closer way to do it:

    .class1, .class2 { text-indent: 100 }

    .class2 { 
            /* Styles you want to have only in class 2 */
    }

    <span class="class2" />

On the other hand, as @A. Wolff has pointed out, you can still use js/jq to add class to specific elements: $(function(){$('.class2').addClass('class1')}); Then just set a specifc CSS rule for these elements.

In case you don't want to use JS, for something like that you'd need to use SASS or similar, which "compiles" to CSS.