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

Social links with HTML and CSS

@a-fox-on-the-moon

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


Hi everyone !

Pretty simple challenge, I still wanted to do it because I want to re-use it for myself in the future.

I would love some feedback anyway :)

Community feedback

@MelvinAguilar

Posted

Hello there 👋. Good job on completing the challenge !

I have some suggestions about your code that might interest you.

  • You should remove the overflow: hidden from the body element. This could prevent scrolling, and you should test your solution on a mobile device in landscape orientation, where you might notice that the content doesn't fit on the screen, and the use of overflow: hidden prevents scrolling.

    The scroll issue in your solution is caused by the default margin of the body tag. You should set its margin to 0 or use a CSS reset to clear default styles imposed by the browser.

  • Define the height of the image using fixed units such as pixels/rem/em. On my laptop, the image stretches too much because of using height: 35%.

I hope you find it useful! 😄

Happy coding!

Marked as helpful

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