Skip to content
Submitted 5 months ago

Social Links Profile – Frontend Mentor Challenge

Alexander Romero•180
@AlexanderTejedor
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 feel proud of being able to solve a challenge with the tools provided, for example, just the images, since I don't have the Pro version. However, that wasn't an impediment to presenting something decent and very similar to the original.

It's always good to get feedback from other users. I'm not an expert and I'm still learning. I know I can make many aspects of my code more optimal and much better!

Community feedback

  • Darkstar•1,100
    @DarkstarXDDPosted 5 months ago
    • You are using a <button> inside an <a>. That is not correct. They both have their own use cases. You have to pick the one that suites your use case. A button is used for toggling content (eg: an accordion) or submitting a form. Anchors (links) a used for navigation. Here's a good article for reference: when-to-use-a-button-or-link
    • In this case it's an anchor styled like a button.
    • The location is not a heading. It's a <p>.
    • For the blockquote text you can use the <blockquote> element.
    Marked as helpful
    0
    Alexander Romero•180
    @AlexanderTejedorPosted 5 months ago

    @DarkstarXDD Thanks for you feedback !! Already make the changes ☺️

    0
    Darkstar•1,100
    @DarkstarXDDPosted 5 months ago

    It's still not correct. Read again what I have said above.

    • The clickable items in this design are <a>. When you click on "GitHub" it will take you to github.com. That's a navigation. Navigations are done using <a>.
    • Also those set of links are a list. button-content should be an unordered list (<ul>). Github, Linkedin etc. should each be a list item (<li>) inside that <ul>. Inside each <li> there should be an <a>.
    <ul class="button-content">
  <li><a>GitHub</a></li>
<ul>
    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