Skip to content
Submitted over 2 years ago

Url shortener

amichno•220
@amichno
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...URL shortening API landing page
  • HTML
  • CSS
  • JS
  • API
3intermediate

Design comparison

SolutionDesign

Solution retrospective

Hello! I have an issue with svg images in footer(social media logos). I have no idea what to do to make them change color on the hover. I have tried to change color in the file, import them on different wayes but there is still something wrong and the color do not change. I will apretiate, if somene could help me solve this problem :)

Anna

Community feedback

  • BreinerJT•530
    @BreinerJTPosted over 2 years ago

    Hello Ana, congratulations on completing this challenge.

    Your svg body is like this:

    <path fill="#FFF" d="M22.675 0H1.325C.593 0 0 .593 0 1.325v21.351C0 23.407.593 24 1.325 24H12.82v-9.294H9.692v-3.622h3.128V8.413c0-3.1 1.893-4.788 4.659-4.788 1.325 0 2.463.099 2.795.143v3.24l-1.918.001c-1.504 0-1.795.715-1.795 1.763v2.313h3.587l-.467 3.622h-3.12V24h6.116c.73 0 1.323-.593 1.323-1.325V1.325C24 .593 23.407 0 22.675 0z"></path>

    You need to delete the fill property after the path tag and your hover should work. This will only work on svg tags within the html code but not in svg tags in image tags.

    0
    amichno•220
    @amichnoPosted over 2 years ago

    @BreinerJT Hi! Thank you for your response! This my mistake, i have to folders with icons. I have removed the fill property but in wrong catalog.

    1

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord