Skip to content
Submitted almost 2 years ago

QR Code Component using HTML, CSS and Grid

Hernán Burgos•70
@burgosha
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 strategies other than my solution do you use or know to center elements on a web page?

Community feedback

  • Jason 👾•160
    @super-gillPosted almost 2 years ago

    I used flexbox but grid is another CSS tool that would work, the major css frameworks build upon these for even more flexibility and responsiveness. Take a look at flexbox in particular but also grid, heres a handy poster I use all the time:

    Flex: https://css-tricks.com/snippets/css/a-guide-to-flexbox/

    Grid: https://css-tricks.com/snippets/css/complete-guide-grid/

    TBH on this site you will want to use the absolute crap out of both of these, often together.

    Marked as helpful
    1
    Hernán Burgos•70
    @burgoshaPosted almost 2 years ago

    @super-gill Hi! and thank you for your reply! I have seen your code and I found interesting your solution with flexbox. I will surely try it in the next challenges. In this challenge I tried to use flexbox but I failed. I wanted to use flexbox with a parent div element, but I couldn't center the card. I didn't imagine (actually I didn't know) that it could be used in <body>. Thank you very much!

    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