Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted 5 months ago

Social Links Profile

accessibility, bem, react, wordpress
GH0STZILLA•60
@GH0STZILLA
A solution to the Social links profile challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


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

This project taught me how to structure a profile card that includes a picture, a name, a short description, and a set of social media links. I got better at using Flexbox to stack and center elements, and I practiced creating interactive buttons with hover effects to improve user experience.

It was also a great opportunity to work with variables for consistent colors and spacing, which helped make the styling cleaner and more maintainable.

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

Getting the alignment and spacing just right between the different elements (avatar, name, buttons) was tricky at first. I wanted the layout to feel balanced on both desktop and mobile, so I had to tweak padding, font sizes, and margins a few times.

Another challenge was making sure that the buttons were accessible and visually consistent, with proper contrast and readable text.

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

I would really appreciate feedback on:

Overall layout and visual balance — does the profile look clean and well-spaced?

Button styling — do the social links look good and feel intuitive to click?

Responsiveness — is the design working well on all screen sizes?

Code structure — any tips on improving the organization of my HTML and CSS?

Any suggestions for improving how I structure profile pages or create reusable components would be super helpful. Thanks a lot!

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on GH0STZILLA's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License