Search code examples
cssclassnestedparent

is there anyway of grouping css classes together?


Quick question which is mostly explained by the code.

Is this possible in CSS or do I have to just implement all the classes in the html?

.class1{
    color:red;
}
.class2{
    text-decoration:underline;
}
.class3{

    class1;
    class2;
    border:1px solid green;
}

Solution

  • It is not possible to do it as such. If an element needs to have multiple classes, just specify it in the HTML :

    <span class="class1 class2">Test</span>
    

    Note that it is possible to define a selector for elements having multiple classes. .class1.class2 selector would target the element in the example here above, while not targetting elements that don't have both classes specified in HTML. This is usefull for example if you wish to override one of the properties of 1 of the classes only when they're used in combination.