Skip to content
Submitted 4 months ago

social-links-profile-main built with HTML and CSS

Ridwan Hasan•400
@Ridwan10000
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Social links profile
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

I am proud of making this project as close to as the preview possible

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

I was having trouble centering the links. At first I tried to use unordered list. Then I removed them and put div tags wrapped around with anchor tags. That made it simpler

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

I tried to make it responsive. Give me any suggestions regarding the responsiveness of the page. Also give suggestions regarding the area of code where I must improve to be a good frontend developer

Community feedback

  • Darkstar•1,100
    @DarkstarXDDPosted 4 months ago
    • There is no need to specify a min-width on your container. No need to specify a width either. max-width is enough, could be better if it was in rem instead of px.
    • No need to specify a width for the social media links either. I see you have given them a width of 95%. Avoid using fixed widths on text elements.
    • There is no <header> in this design. <header> purpose is to hold primary repeating content across every page of a site, such as the logo of the brand and the navigation bar.
    • The social media links should be list items. So each <a> should be inside a <li>.
    • There is no reason to have a <div> inside the <a>. You can make the <a> a display: block and put the text directly inside the <a>.
    • Would be nice if you give your page a title. Currently it says "Document". I usually give the challenge name as the title.
    Marked as helpful
    1
    Ridwan Hasan•400
    @Ridwan10000Posted 4 months ago

    @DarkstarXDD Thanks for your suggestion. I will be careful while designing from next on.

    0

Please log in to post a comment

Log in with GitHub

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