How can you use a symbol from SVG defs.svg as background image in CSS?

Viewed 2346

I'm trying to use a symbol from my defs.svg as a background image in CSS, as opposed to a direct path to an individual SVG file.

So instead of:

background: url(spoon.svg);

I want to do something like this:

background: url(defs.svg#spoon);

With #spoon being a symbol in defs.svg with id="spoon". Unfortunately, this isn't working for me. Has anyone come across a solution that doesn't involve custom JS/etc?

1 Answers
Related