Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive social links profile using flexbox

P
tedikoā€¢ 6,580

@tediko

Desktop design screenshot for the Social links profile coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello! It's nice to come back here after a few years. Time to refresh some knowledge! No specific questions, but feedback or a criticism will be appreciated!

Community feedback

Daniel šŸ›øā€¢ 37,790

@danielmrz-dev

Posted

Hello @tediko!

Your solution looks awesome!

šŸ“Œ Instead of using margin-bottom on each <li>, you can set display: grid and gap property on the <ul>. With gap, you create an equally sized space between all the elements inside the parent container, so you don't need to add the margin to each child element.

I hope it helps!

Marked as helpful

1

P
tedikoā€¢ 6,580

@tediko

Posted

Hi @danielmrz-dev!

Indeed, using gap together with display: flex or grid will be more convenient than using a separate selector. Thanks for your feedback!

1

Please log in to post a comment

Log in with GitHub
Discord logo

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