Menu
How to use deep selector in scss in vue?
The code below not work.
<style lang="scss" scoped>
.a{
&>>>.b{
...
}
}
</style>
A deep selector like >>> in css but in scss inside vue single file component.
574
The good news is that the Vue CLI makes it incredibly easy to support writing SCSS, and with Vue's single file components you can simply add lang="scss" to the <style> block ( docs).
V Deep is the Boomtown Rats's fifth album, and the first to be released as a five-piece band, following the departure of guitarist Gerry Cott. It includes the minor hit single "House on Fire". V Deep. Studio album by.
The only way to override the css is to get higher points of specificity. For example, adding the class . btn to the selector gets the same two points but it still looses because of the order of precedence.
css file. The ::deep pseudo-element selects elements that are descendants of an element's generated scope identifier. The following example shows a parent component called Parent with a child component called Child .
I had the same issue, and i eventually fix this using ::v-deep as stated here:
https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors
<style lang="scss" scoped>
.v-input {
::v-deep .v-text-field__details {
min-height: 0;
margin: 0;
.v-messages {
min-height: 0;
}
}
}
</style>
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
