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

QR Code Component - learning

mrxshinji 370

@mrxshinji

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


  1. What did you find difficult while building the project?
  • Centering Element is still pretty annoying to handle

Community feedback

Lucas 👾 104,420

@correlucas

Posted

👾Hello @mrxshinji, Congratulations on completing this challenge!

Your solution its almost done and I’ve some tips to help you to improve it:

1.You’ve used <div> to wrap the card container, in this case you need to use <main> since this is the main block of this page.

2.Every page needs a main heading, the <h1> to show which is the most important heading. You need to increase the headings by one level, like h1, h2, h3 to show the titles hierarchy. Remember that you cannot have more than one h1 heading.

3.Add the alt text to allow screen readers to recognize that img. Adding alternative text to photos is first and foremost a principle of web accessibility. Visually impaired users using screen readers will be read an alt attribute to better understand an on-page image.

✌️ I hope this helps you and happy coding!

Marked as helpful

1

@AdrielMurray

Posted

Great work @mrxshinji your project looks nearly identical. You can reduce the boldness of your <h2> and start learning how to use media queries to make your projects responsive for mobile.

**Happy Coding ✌️ **

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