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 Profile with Flex and SASS

@Pixelazation

Desktop design screenshot for the Social links profile coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

Sarah 560

@AutumnsCode

Posted

Hi,

Well done for completing this challenge. While it includes some semantic HTML elements like main and h1, h2, you could have used other semantic HTML elements instead of the div elements. Semantic HTML has many advantages, such as improving the accessibility of a webpage.

here is a link to an article, explaining sementic Article

Regarding accessibility Img Element need to have an alt to have some sort of text in it.

When working on your css, it would be helpful to reset certain default styling, especially when you are using some of the sementic Html in the future. One of the common reset are :

  *, *::after, *::before {
    margin: 0; /* this is debateable */
    padding: 0; /* this is debateable */
    box-sizing: border-box;
}

Explaination: Every Element in your code, will set there margin and padding to 0. There are way more reset you can do, but I would suggest to look into it a little more

0

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