Submitted about 2 years ago

Url shortener

amichno• 220

@amichno

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

URL shortening API landing page

HTML
CSS
JS
API

3intermediate

View challenge

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

@BreinerJT

Posted about 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.

amichno• 220

@amichno

Posted about 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.

Please log in to post a comment

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