Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

NFT preview card component

IZY_BOYβ€’ 70

@IZY-BOY

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

πŸ‘¨β€πŸ’»πŸ‘©πŸΎβ€πŸ’»πŸ‘¨πŸΎβ€πŸ’» HI!!! Here is my solution for this challenge and i'm IZY_BOY! 😁😎😊

πŸ› οΈπŸ› οΈπŸ› οΈ Built with:

  1. HTML πŸ–‹οΈπŸ–‹οΈπŸ–‹οΈ
  2. Custom CSS 🎨🎨🎨

What challenges did you encounter, and how did you overcome them?

An interesting challenge. I had difficulty in coding the active state of this challenge.

I learned a lot from doing this challenge. πŸ˜ŠπŸ‘πŸΎπŸ‘πŸΎ

What specific areas of your project would you like help with?

I'm open πŸ‘‚πŸΎπŸ‘‚πŸΎπŸ‘‚πŸΎ to any suggestions on how I can improve this project or make it easier, feel free to leave me a comment!✍🏾️✍🏾️✍🏾️

Feedback welcome. πŸ˜πŸ˜ŽπŸ‘πŸΎ

Community feedback

IZY_BOYβ€’ 70

@IZY-BOY

Posted

Hi, I just notised a probleme with my solution but don't know how to fix it. When the cursor is on the equilibrium image, the color changes to cyan but the eye is not visible. any suggestions about this???

0

pvcordeiroβ€’ 110

@pvcordeiro

Posted

@IZY-BOY Create a container with the eye image inside of it. Add the cyan color as the container background (remember the alpha to make it translucent) and and make both the container and the eye invisible with opacity: 0; then on your ::hover add both again and use opacity:1;

0

@xaintobas

Posted

@IZY-BOY try loading the eye icon correctly in your index.html file by using the code below. It should work.

<img class="equilibrium" src="images/icon-view.svg" alt="eye">
0
IZY_BOYβ€’ 70

@IZY-BOY

Posted

@xaintobas on my computer the image is visible but when i connecte from the github livepage link it doesn't.

0

@xaintobas

Posted

@IZY-BOY yeah. It's like that most times. Please try to update your index.html with the code and push the update to GitHub. Let me know if it works that way.

0

@Hangar5

Posted

@IZY-BOY How are you?

The error is here; <img class="equilibrium" src="../images/icon-view.svg" alt="eye"> where it says src=" instead of two dots .. there must be only one, it would look like this.

<img class="equilibrium" src="./images/icon-view.svg" alt="eye">

That's it, the image should be visible without any problem.

Greetings πŸ‘‹

Marked as helpful

0
IZY_BOYβ€’ 70

@IZY-BOY

Posted

@Hangar5 I'm fine and i hope you too???

Thanks for the help, it worked.😁😎πŸ₯³

0

Please log in to post a comment

Log in with GitHub
Discord logo

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