Menu
Is there a way to give SASS styles applied using the @extend feature the status of being !important? I tried this:
.somestyles { width: 1000px; } .importantstyle { @extend .somestyles !important; } Didn't work, but how might this be done? Or is it just not possible?
483
Sass @extend Directive The @extend directive lets you share a set of CSS properties from one selector to another. The @extend directive is useful if you have almost identically styled elements that only differ in some small details.
It is a very important and useful feature of Sass. The @extend feature of Sass allows classes to share a set of properties with one another. In complicated CSS where many classes are put together, duplication of properties may occurs.
@mixin is used to group css code that has to be reused a no of times. Whereas the @extend is used in SASS to inherit(share) the properties from another css selector. @extend is most useful when the elements are almost same or identical. The main difference between the two is in their compiled CSS file.
What you're asking for is not possible. You could increase the specificity of the selector that's doing the extending.
body .importantstyle { @extend .somestyles; } If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
