2 ms·
Ask HN: Anyone find it infuriating how you can't easily style SVGs in HTML?
At least, without embedding the full code for the SVG in the SVG element?
Because to be honest, I've always found that the way SVGs work at the moment just completely nullifies most of their supposed benefits. Imagine if you could just say:
background: url(icon.svg)
And then in the stylesheet have part of the icon change colour when you hover over its container like this:
.svgPath { fill: red }
That's how you'd expect a linked SVG to work in a web page, and it'd open up a million interesting possibilities too. Like say, having a single spritesheet for a website's icons that lets you edit their colours on the fly based on the context of the page.
Yet that's not how it works in browsers, and I don't see any evidence it ever will be.
So why is that? Why did the W3C make it so SVGs can only really be interacted with when embedded into the page code itself rather than merely linked like any other image?
It just feels illogical, and like something obvious that the web's missing nowadays.