Submitted about 2 months ago

Social-links-profile

MargaritaAlex•80

@MargaritaAlex

A solution to the Social links profile challenge

Preview Code

Solution retrospective

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

I did it without the Figma document.

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

I had trouble setting the right HTML so I can style it with CSS. I need to learn a bit more about attributes and how to use them. There is a lot to learn

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

I still need help with everything :(

Code

Please log in to post a comment

Community feedback

P
skhbabez•60
@skhbabez
Posted about 2 months ago
This is a strong solution overall, and I don’t see any major issues. While some values—such as font sizes and paddings—are slightly off due to not referencing the Figma file, the result still looks good and functions well, so it’s not a concern.

A few improvement ideas, though: in the designs, they reduced the padding of the card slightly on mobile. This can be accomplished with a media query or the clamp() function.
```
.class {
    padding: 1rem;
}

@media (min-width: 768px) {
  .card {
    padding: 2rem;
  }
```
You also missed out on using semantic elements, such as a <main> element for the page or an <article> for the card.

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