Skip to content
Submitted over 2 years ago

Simple qr code component solution with HTML and CSS

Archer•90
@Archerking47
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

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 ?

Community feedback

  • Praveen Perumal•740
    @solvedbiscuit71Posted over 2 years ago

    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
    0
    Archer•90
    @Archerking47Posted over 2 years ago

    @solvedbiscuit71 Thank you for the feedback :)

    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