The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Targeting SVG icons with CSS not working in Webkit Reply To: Targeting SVG icons with CSS not working in Webkit


Thanks for looking into this Paulie_D — I played around with your pen and it turns out you can apply CSS to the internals of a <use> element, but that ended up not being my issue.

I found out that The svg’s I was saving via Adobe Illustrator were including presentational markup like stroke="#FFFFFF" and fill="#FFFFFF" and these were for whatever reason preventing the styles applied to stroke and fill in my CSS from being applied. Since I am using Grunt.js to automate the concatenation and cleaning of my SVG files I opted to re-save each of my icons with no colors applied to the strokes or fills, and now I’m able to style them with CSS as expected.

Thanks for your help getting me on the right track though!