Skip to content
Submitted over 3 years ago

Simple qr code component solution with HTML and CSS

Archer•90
@Archerking47
A solution to the QR code component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What I find difficult building the project was understanding this instruction

"The designs were created to the following widths:

  • Mobile: 375px
  • Desktop: 1440px"

I'm not sure whether to use media query or just "max-width" the parent container.

What do you think ?

Code

Please log in to post a comment

Log in

Community feedback

  • Praveen Perumal•740
    @solvedbiscuit71

    Hi Archerking47, Good work on your project.

    No, you need not use media queries or max-width on the container since here the card have fixed dimension so just using display: grid on the parent container with place-content: center will be fine.

    And regarding the accessibility issue wrapping the card element with a main tag will resolve it.

    Marked as helpful

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