Join GitHub today
GitHub is home to over 40 million developers working together to host and review code, manage projects, and build software together.Sign up
Internet Explorer 11 svg images appears all black #23
I´m having some troubles with IE11, some svg's appear all black, while others don´t.
My initial thought is that the CSS rules included in your SVGs are colliding with each other. This happens because when you inline your SVG markup directly on the page (manually or using a helper like SVGInjector) any style rules are now in the scope of the main page's primary parse tree and no longer isolated to only that single SVG (unlike when you use an SVG as the
6.15 The scope/range of styles - http://www.w3.org/TR/SVG/styling.html#Scope
You can test that out by adding a rule like
So, I'd start by looking at the styles included in the SVGs and see if they are stepping on each other, and possibly look at consolidating and extracting those styles into your main page's CSS (think of them as a theme, or a set of styles, to be applied across all your page SVGs). Alternatively you can make the selectors in each SVG more specific, like giving each SVG a unique
Not sure why you'd only see this issue in IE11 though. Does this happen in Chrome or FF too?
Let me know if that makes sense and helps. Happy to debug further if you have some example code (using multiple working & non-working SVGs) or a dev site you want me to look at.
Hi, thanks for the fast reply.
After some testing I've determined that for some reason IE doesn't evaluate
I've come up with a simple workaround that does trigger IE to read and use any and all
This workaround is in the svg-injector.js code and it is now automatically called during the injection process for each SVG.
I've also added a test case in
@pbsmultimedia: Please try out the new
I have a problem, my svg logo is all in black on the main page but by taking the full path only the svg is seen correctly, and the css load is external I can not understand why that happens.
look https://mallregional.cl/portal error logo see all black