Skip to main content

Forums

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #190455
    bearhead
    Participant

    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…

    #190463
    Shikkediel
    Participant

    This reply has been reported for inappropriate content.

    Works on FF though. But I think it needs to be addressed as an attribute and not a style property for the rest.

    #190468
    Shikkediel
    Participant

    This reply has been reported for inappropriate content.

    What’s a bit strange is that removing the attribute and setting fill as a style property doesn’t seem to work either.

    #190483
    Paulie_D
    Moderator

    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

    #190486
    Shikkediel
    Participant

    This reply has been reported for inappropriate content.

    That’s beyond my knowledge on the subject (luckily there’s jQuery too).

    #190603
    bearhead
    Participant

    This reply has been reported for inappropriate content.

    ok, thank you both for helping with this. I think applying the class to the use element like paulie_D demonstrated will work for my purposes.

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.
icon-link icon-logo-star icon-search icon-star