question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

SVG's overwrite each other's CSS classes

See original GitHub issue

Having multiple svg’s in one view overwrrite each other’s CSS classes resulting in weird colors because all svg’s use the same classnames

(e.g. adding azure functions overwrites the planet color’s .cls-2) image

(e.g. azure services page which has a lot of svgs) image

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:3
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
jsondoocommented, Aug 1, 2019

@SahilTara ohh nice, if the script is ready then just go with the first

our original plan was to update all the svg’s classnames anyways

1reaction
SahilTaracommented, Aug 1, 2019

@jsondoo I have a fix for this, gonna wait for the role pr to go in first.

Read more comments on GitHub >

github_iconTop Results From Across the Web

SVGs override each others CSS-style - Stack Overflow
When you save, use File > Save As > SVG , then click on "More Options" and change the "CSS Properties" setting. If...
Read more >
[Solved]-SVGs override each others CSS-style-Vue.js
If it is set to "Style Elements", change it to one of the other options. If you do that, it won't use classes...
Read more >
SVG Properties and CSS
Presentation attributes are used to style SVG elements and can be used as CSS properties. Some of these attributes are SVG-only while others...
Read more >
Inkscape 1.1 (c68e22c387, 2021-05-23) overwriting CSS ...
So far the working solution is to find and replace the class names for each SVG or at least the different SVG's. This...
Read more >
Styling — SVG 2
SVG user agents must support all of the CSS styling mechanisms described in this chapter. In SVG 1.1, support for inline style sheets...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found