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

Social Profile Card for web and mobile screens using HTML and CSS

@emeraldknytt

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 am quite impressed to have built the profile card without using Figma starter pack. While it took me a significantly longer time to get the values right, I liked the challenge it posed. I would like to purchase the pro plan as I will greatly benefit from using it to further improve on my skills. Thank you, Frontend Mentor!

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

The biggest challenge I faced was in trying to make sure that my solution mimics the design as best as I could afford to get it done without using Figma. Also, I struggled a little with the socials components, not knowing if a `` tag with border property was better than using a button tag. I eventually went with the latter as it made more sense that those components links and are meant to be clicked.

Community feedback

@yahappylemon

Posted

I also spent a lot of time and effort on the design without the Figma file😂

As for the social links part, I went for <a> tag with padding instead of <button>, since there's a href attribute on <a> and it seems more semantic in my opinion. But I think both ways will do the job!

Anyway, you did a great job!

Marked as helpful

0

@emeraldknytt

Posted

I do agree it is quite frustrating working on the solution without the Figma pack, I will consider getting the pro pack as the tasks increase in complexity. Thank you for your encouraging comment!

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