huddle-landing-page

Community feedback

• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted almost 2 years ago

  Hello there 👋. Good job on completing the challenge !

  • Social media icons, which are often used to link to a company's social media profiles, should typically be anchor elements because anchor elements allows users to easily click on the icon and be taken directly to the company's social media profile page. This makes it easy for users to connect with the company on social media

    Note: The <i> elements should not have an href attribute because they are not links.

    Additionally, you should use the aria-label attribute to describe the links if they don't have visible text, this will help screen reader users to understand the purpose of the link.

  e.g. <a href="#" aria-label="Facebook"><i class="fa-brands fa-facebook-f"></i></a>

  • On mobile devices it looks strange because the body element has too much padding and the svg has a defined width which makes it expand off the screen.

  I hope you find it useful! 😄 Above all, the solution you submitted is great!

  Happy coding!

  Marked as helpful

  2

  ---

  

  0xev•120

  @0xevPosted almost 2 years ago

  Thank you @MelvinAguilar !

  I've ran into many issues in this challenge

  I couldn't center website anymore via body because there was a header already and I used display:flex for centering (that's why body element had too much padding and svg was looking like ****)

  When I tried to center it via display:grid it was even worse

  Also, in mobile design the svg wasn't changing properly based on resolution. It completely lost its dimensions

  Many many things I didn't know how to solve. If you have any idea, let me know! :)

  0