I'm trying to make a SVG icon sprite, something like in this fiddle
http://jsfiddle.net/8ke8nsft/6
Only difference is on my app I use a relative URL "../images/svg-sprite.svg#home-icon" this works great on chrome and safari, but doesn't show up on firefox.
<svg class="home-icon">
<use xlink:href=../images/svg-sprite.svg#home-icon"/>
</svg>
Firefox works perfectly when I add the svg sprite inline on top of the page then use it
<svg class="home-icon">
<use xlink:href=#home-icon"/>
</svg>
and this is my SVG file
<svg>
<symbol id="home-icon" viewBox="0 0 512 512">
<title>Home Icon</title>
<path d="M512,296l-96-96V56h-64v80l-96-96L0,296v16h64v160h160v-96h64v96h160V312h64V296z"/>
</symbol>
</svg>
am I missing something here?