When we attach the !important
keyword to a mixin call, the Less compiler will automatically add the !important
to all properties that are present within the mixin.
For example, consider the below mixin:
.set-default-props() {
margin: 4px;
padding: 4px;
border: 1px solid black;
font-weight: normal;
}
When the !important
is attached to the mixin call like below,
#demo {
.set-default-props() !important;
}
the compiled CSS would look as follows:
#demo {
margin: 4px !important;
padding: 4px !important;
border: 1px solid black !important;
font-weight: normal !important;
}
Note: Usage of
!important
is considered as bad practice and must be used only as the last resort.