Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Apply CSS property only if it overrides, else, do nothing

Is it possible to only apply a CSS style if it overrides another? In the case that it does not override, it should not apply itself.

<svg ... />
<svg fill="#fff" ... />

How would you go about only modifying the fill property if it is defined? Is this possible through only CSS?
Thanks

I have tried using !important to override the property in case it is in-line but I am unable to get the property to apply conditionally.

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

Try using attribute selectors, and perhaps also attr() to get what the value is:

svg[fill] {
    fill: attr(fill);
}
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading