Skip to content
Submitted 12 months ago

Social links profile solution

RajanCP•90
@RajanCP
A solution to the Social links profile challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What are you most proud of, and what would you do differently next time?
  • Proud of my ability to understand how to structure html so it is semantically correct.
  • Additionally, understand how to use media queries to make my website responsive.
What challenges did you encounter, and how did you overcome them?
  • Had not come across for lists and therefore had to research it
Code

Please log in to post a comment

Log in

Community feedback

  • Svitlana Suslenkova•5,340
    @SvitlanaSuslenkova

    You have <main> and <div class="container">. You don't need two, just one is fine. Also when you want to align project to the center with flex or grid add min-height: 100vh; As now your aligns everything to the center of it's height, not to the center of your view. Hope you found this comment helpful :)

  • P
    MikDra1•7,470
    @MikDra1

    I encourage you to use this technique to make the card responsive with ease:

    .card {
width: 90%;
max-width: 600px;
}

    On the smaller screens card will be 90% of the parent (here body), but as soon as the card will be 600px it will lock with this size.

    Also to put the card in the center I advise you to use this code snippet:

    .container {
display: grid;
place-items: center;
}

    Hope you found this comment helpful 💗💗💗

    Good job and keep going 😁😊😉

  • Babalo Nogqala•30
    @babalonogqala23

    great work it is kind of hard to make something pixel-perfect but you did very well.

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