4

I am working with gulp-sprite trying to load svgs into a styleguide. I have created the icon.svg, but when I try to display them in a different HTML file using xlink:href the svgs aren't showing. The shadow-root is empty.

I have tried multiple things, this works in Edge, but no other browser. I have even got it to work including the sprite, but hiding it within the html.

<!-- icon in html -->
<svg>
  <use xlink:href="assets/images/icons.svg#BlueCard"></use>
</svg>

<!-- external svg file -->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><symbol viewBox="0 0 72 64" id="BlueCard"><path d=...></symbol></svg>

I expect the icon to be there and the shadow root to not be empty. Should include the path

hurdler131
  • 41
  • 2

0 Answers0