Consolidating CSS classes into one custom class

Question

Is there a way to take:

<button class="btn btn-primary btn-block">

And change it to:

<button class="btn btn-foo">

...with...

.btn-foo { 
    /* apply .btn-primary */
    /* apply .btn-block */
}

Kind of... Would I have to use a custom id to apply multiple classes instead of using a custom class to apply multiple classes? — Kate R, Nov 27 '19 at 18:10
You do not need any id to apply multiple classes. You can just put as many classes as you like into the `class` attribute. — Artur Noetzel, Nov 27 '19 at 18:25

score 0 · Accepted Answer · answered Nov 27 '19 at 18:59

0

You can easily do so with SASS pre-processor by using @extend.

someDiv { @extend .opacity; @extend. 
.radius; }

Otherwise, you could use JavaScript (jQuery) as well:

$('someDiv').addClass('opacity radius')

answered Nov 27 '19 at 18:59

Sarvesh Mahajan

I forgot I could do that with jQuery! Thank you! – Kate R Nov 27 '19 at 19:07
Appriciate a vote count, if you are satisfied with answer, thanks – Sarvesh Mahajan Nov 27 '19 at 19:14

1 Answers1