How to reuse css class content in another class without copying?
css, html
Solution
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.
Problem
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 can not change this: */ <span class="class2"> ``` The definition for `class2` is also contained in another library. So I can not change it directly. ``` /* But I want to do something like that in my CSS file: */ .class2 { .class1 } ``` I know it is not possible in that form. But maybe one can use some trick to achieve the behaviour without copying of the content of `class1`? I need this because I want to redefine class with content from another CSS class. Our project uses jQuery as well, but I would do it rather with CSS. EDIT: I should explain more, I could not change how `.class1` is defined, because this class is in a library, and I could not change mark up on span class.