Skip to content
Submitted over 1 year ago

Social links profile using CSS Flexbox

Anton Vasilache•580
@Antonvasilache
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?
  • Content looks proportionally similar to the design file
  • Less time to figure out than previous challenges
What challenges did you encounter, and how did you overcome them?
  • Difficulties in centering the content, but managed to do it using flex container and margin: 0 auto 36px auto; on the content children
  • Had to adjust margins and padding repeatedly to get it right
  • How to apply the font properties the style guide
What specific areas of your project would you like help with?
  • Not sure how the focus state should look like
Code

Please log in to post a comment

Log in

Community feedback

  • P
    Stefan Holmgren•220
    @stefan-holmgren

    Looks good!

    I centered the content by using

    .profile {
  ...
  text-align: center;
}

    The only thing I had to fix to keep centered were the avatar-image which i set up like:

    .profile .avatar {
  ...
  margin: auto;
}
  • Lawal Toheeb•30
    @LToyyib

    Welldone! But you did not publish your work with a live page on 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