Kevin Powell - CommunityKP-C
Kevin Powell - Community14mo ago
14 replies
snxxwyy

Class overwriting styles it shouldn’t?

Hey, I’m trying to style a button with two classes with the [class|=“”] selector, if I add with-icon and button at the same time it overwrites all of the styles for the button class. This would totally make sense if both classes had the same properties in which case the cascade would handle which values are used, but it overwrites things in button that with-icon doesn’t have, such as background-color. I want it to overwrite the display property only in this case, which I thought it would do.

It doesn’t do this when I use regular class selectors e.g .button so it must be selector related, but this selector says ‘if the element has a class with that value or one that starts with that value, this doesn’t sound like they should clash in any other way than expected?

https://codepen.io/deerCabin/pen/EaYyaqr

I’d appreciate any insight. Am i missing something? Thanks in advance.
Was this page helpful?