react-inlinesvg: Remote svg improperly rendered
I don’t think there’s much to say about it. Am i completely missing something here?
Here is the code <SVG src={`${cdn}/icons/${icon}`} />
Here is how it looks
Here is how it looks using regular img tag:
When i inspect these elements they look completely fine. The whole svg source is correct. I tried filling colors, fitting the objects but no luck.
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Comments: 20 (10 by maintainers)
I have the same issue. If I use an img tag it renders it correctly. If not, it looks messed up. I tried the same svg on an online tool, this: https://www.rapidtables.com/web/tools/svg-viewer-editor.html and it looks perfectly fine. Therefore, something happens with the react-inlinesvg 🤔
I am working with the latest Chrome browser, so I guess it should not be the browser. Another thing that I noticed is that I have so far used two icons. One is rendering properly, the other not!! So, sth in that svg is failing, but not sure what.