How to link to an external CSS style in SVG?

I have a Codepen where I try three different methods of importing an extrenal stylesheet into an SVG. I'm working from the specification which says:
An HTML ‘link’ element in an SVG document (that is, an element in the HTML namespace with local name "link") with its ‘rel’ attribute set to 'stylesheet' must be processed as defined in the HTML specification and cause external style sheets to be loaded and applied to the document.
I tried: ● A <link/> tag in the <defs/> section with an xmlns="http://www.w3.org/1999/xhtml". ● A <svg> with a xmlns:html="http://www.w3.org/1999/xhtml" & containing a <html:link/> tag. ● A <style> tag with an @import url() directive. Only the last one works, and when I select either of the <link/>s in the Inspector and console.debug($0.namespaceURI), I get http://www.w3.org/2000/svg. How do I create a HTML <link/> tag within a SVG document short of JavaScript?
5 Replies
ἔρως
ἔρως2mo ago
have you tried to use the html namespace?
dys 🐙
dys 🐙OP2mo ago
Where? I tried it in the <link/> as xmlns & in the <svg/> as xmlns:html.
ἔρως
ἔρως2mo ago
also, have you tried to @import the css?
dys 🐙
dys 🐙OP2mo ago
The @import works.
ἔρως
ἔρως2mo ago
if nothing else works, that's the option then and i have no other ideas
Want results from more Discord servers?
Add your server