[Solved] problems changing svg fill on hover

[bearhead]

Please see this pen:
http://codepen.io/anon/pen/jEWdVE

I’m trying to get the facebook icon to fill black on hover. I am targeting the ‘circle’ element of the svg and think I am targeting it correctly because I am able to change the fill to blue in my css. However, the fill rule doesn’t work when I apply it to :hover

Is it not possible to target an element within an svg? I’m not really sure why this won’t work…

[Paulie_D]

You can’t target the inner contents of a use element individually with CSS.

You have to use a class on the use and it will apply to all sub-elements within the use unless the component sub-element has inline styles.

At least that’s how I think it works.

http://codepen.io/Paulie-D/pen/PwZgeR

[Author]

Posts