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 main using HTML, CSS Flexbox

@lucas-brisolla

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@obocanegra-dev

Posted

Hello Lucas! 👋

Congratulations on completing your first challenge on Frontend Mentor! 🎉 You've done a great job, and I'm thrilled to see your progress.

Here are some suggestions to further improve your project:

I highly recommend using semantic elements instead of relying on numerous <div>s. Semantic elements like <header>, <nav>, <main>, and <footer> add meaning and structure to your HTML, improving accessibility and search engine optimization.

For the QR code image, it's important to provide a description in the alt attribute, such as "QR code to Frontend Mentor website." This helps provide clear context for users relying on screen readers and enhances the accessibility of your site.

Remember that font sizes should never be specified in pixels. It's best to use relative units like rem or em. This ensures that your font sizes are responsive and adapt well to different devices and user preferences.

Consider changing the height attribute to min-height. This allows the content to expand properly if it exceeds the initially set height.

Additionally, it's advisable to avoid using fixed widths. Instead, consider using max-width. This will make your design more responsive and ensure it adapts well to different screen sizes.

Keep up the great work and continue challenging yourself! I'm confident that you'll achieve great things in your future projects. Go for it! 💪🚀

If you have any questions or need further assistance, feel free to ask. Good luck with your future endeavors on Frontend Mentor! ✨😊

Best regards, Oscar

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