Home › Forums › CSS › SVG styling problems with use and xlink › Reply To: SVG styling problems with use and xlink
Brian MeyerThanks for the feedback Chris, buutttt.
I’ve tried all of your recommended permutations.
I pulled the inline styles out of the demo.svg file so you have something like:
<path class=“fml” d=“M27.493….”/>
I’ve updated my demo to reflect:
– no inline styles
– no targeting of the symbol
– no targets via the svg.class found in the HTML snippet.
– only paths are targeted via their class in CSS.
When that’s done, Chrome falls back to filling the SVG paths as black. FF and Safari render as normal.
The inability to style the <path> via its .fml class only arrises when using a linked file i.e. demo.svg#my-icon (vs a set of defs the page: i.e. #my-icon)
notes:
– the demo.svg file is in the same web-directory, as there are cross site linking restrictions.
– Doctype is HTML5: <!DOCTYPE html>
related but also using in page references like #my-symbol vs demo.svg#my-symbol
http://codepen.io/FWeinb/blog/quick-tip-svg-use-style-two-colors