applying multiple bootstrap classes on a single class

Viewed 14

I have this button on multiple places in my code

<button class="btn btn-block btn-lg btn-primary" type="submit ">Sign up!</button>

can I somehow define a single class for that like below?

<button class="myButton" type="submit">Sign up!</button>

and "myButton" will be equivalent to "btn btn-block btn-lg btn-primary".

1 Answers

This is possible if you use SASS, although it is not recommended.

.myButton {
    @extend .btn;
    @extend .btn-block;
    @extend .btn-lg;
    @extend .btn-primary.
}

You can read more about extend here. Also, it's worth reading this page on the bootstrap docs.

Related