Skip to content
Submitted almost 2 years ago

QR Code Challenge | frontendmentor.io

Zack•80
@ZeroScriptz
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Nothing difficult just, I did not want to make a separate CSS file so when trying to make a media query for large scale devices it would break.

Since I mastered the React.js, TailwindCSS, and more libraries. I will continue to use them just to make it easy and fast process!

Unsure of the media queries and locations.

No questions further!

Community feedback

  • Amelia Dutta•160
    @amelia2802Posted almost 2 years ago

    Hi Zack, Congratulations on completing your first challenge! 🎉

    From your code, I can see that

    • You've declared the card section <section class="md">...</section> outside of the <body>...</body> tag. You should declare it inside of the body tag.
    • Add an alt=" " attribute to the <img> as it will be helpful for screenreaders.
    • wrap that .qrHead and Challenge by <a href="https://www.frontendmentor.io?ref=challenge" target="_blank">Frontend Mentor</a> with <p>...</p> tags as those aren't headings.
    • Add display:flex into the .section{..}.

    Hope you find it helpful!

    Happy Coding.😄

    Marked as helpful
    1
    Zack•80
    @ZeroScriptzPosted almost 2 years ago

    @amelia2802 Really helpful, to be honest. Did this one in a rush as I love react more lol. Whichh is my fault of-course Amelia. Thanks!

    0

Please log in to post a comment

Log in with GitHub

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