Skip to content
Submitted over 1 year ago

QR code component with HTML5 and CSS

ana-lsm•80
@ana-lsm
A solution to the QR code component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What are you most proud of, and what would you do differently next time?

Being able to tackle this challenge in less than an hour.

What challenges did you encounter, and how did you overcome them?

Centering all the elements

What specific areas of your project would you like help with?

Adding accessibility to the web page.

Code

Please log in to post a comment

Log in

Community feedback

  • Joramir Jr.•250
    @JoramirJr

    Hi, @ana-lsm!

    One easy step to center your card would be to first define its margin to 0, then the 'height' of the body to '100vh'; after that, by defining 'display: grid' and 'place-items: center' to the body, your card would be centered!

    Hope its helpful!

    Marked as helpful
  • Davisnz•150
    @Davisnz

    Looks good! Just make sure to pay extra attention to the padding and dimensions. Figma's dev tool is great for this

    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