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

Responsive Social links profile made using HTML & vanilla CSS

P

@Choconaldo

Desktop design screenshot for the Social links profile 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?

I'm fishing the challenges much faster, as my coding is improving.

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

Did just fine.

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

None at the moment.

Community feedback

@DanCodeCraft

Posted

Hey @Choconaldo, Nice work!

I would suggest, for improvement, a few points:

  • For accessibility, do not use font size in pixels. Use rem instead.
  • You can add a transition effect when hovering the buttons. It will take you one line of code for a super nice effect.
  • A modern CSS reset could become a good habit of yours, saving lots of lines as well, keeping your code cleaner.

Keep up the good work!

Marked as helpful

0

P

@Choconaldo

Posted

Thank you very much for your feedback, @DanCodeCraft .

The rem suggestion is very good indeed. I'll do that in my next project.

I need to study more about transitions. Good tip.

About the reset, it seems that there is a ton of different types of it around the web and I simply can't find one generic enough to be used in every case. Any suggestions about that?

Thanks a lota again.

0

@DanCodeCraft

Posted

@Choconaldo this is my absolute favorite one: https://www.joshwcomeau.com/css/custom-css-reset/

It was suggested by Kevin Powell (check him out on YouTube in case you don't him. He is a wizard in frontend!). In the link you can see the full reset, you can copy and paste. And he also breaks down each section, so it's also a good reading.

To not become a massive file, I suggest you to create a second CSS file, put the reset there and link it to your HTML file (you can check my recent projects in this site to have a visual idea if needed).

Cheers :)

Marked as helpful

0
P

@Choconaldo

Posted

Thank you very much, @DanCodeCraft . I simply adore Mr. Powell. He's a genius!!

1

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