Skip to content
Submitted over 2 years ago

Qr code linked to frontend mentror using HTML,CSS grid,flexbox

afroditi•30
@afxinti
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

I used flexbox and grid but to center the box of the body I didn't find the best way. I mean I only used margin-top/bottom to center in the middle of the screen and it won't be useful if I had extra elements to align. Any suggestion?

Community feedback

  • Karishma Garg•1,010
    @karishma-devPosted over 2 years ago

    Hi, Your solution looks good.

    To properly center the card you can use something like this: body{ display: flex; justify-content: center; align-items: center; min-height: 100vh;} In this, justify-content will align the content to the center of the main axis and align-items will align the content to the center of the cross-axis (perpendicular to the main axis).

    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