Social Links Profile with HTML & CSS

Solution retrospective
I tried to apply the advice from the previous exercises (modern CSS Reset, Custom Styles, units, no simple div for accessibility, ...). I don't know if it's well applied.
What challenges did you encounter, and how did you overcome them?I'm still having trouble with element sizes and how they behave according to screen size. I hope what I've done follows what was expected.
What specific areas of your project would you like help with?All feedback is welcome, especially on best practices (HTML structures, units, choice of CSS properties, etc.). Thank you for your feedback!
Please log in to post a comment
Log in with GitHubCommunity feedback
- @teabag12
Hi, looks pretty good! Great job! Only one comment: You do use
px
as a unit from time to time. I feel like in this project, it makes sense to use relative units, only (rem etc.), to guarantee for consistency and scalability. So I would suggest you stick torem
for width, margin, and padding etc.Marked as helpful - @0paziz
hey, nice job you did great
- P@kaamiik
Your code structure is really good. Congrats. Some notes for your code:
- Profile images do not need
alt
text. Avoid using words like image, picture, or photo in alt descriptions.
- Why span here?
<p><span>London, United Kingdom</span></p>
You don't need it.
- Instead of a
section
these links is like list items. So you need aul
andli
.
- Not need
width: 100%;
on themain
tag.
- This is
width: 375px;
wrong in the.card
tag. You should not limit the width of the container that contains text. You only need.max-width
.
- Profile images do not need
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