Skip to content
Submitted over 1 year ago

Basic QR code integration with HTML & CSS and Flexbox, no library

David H.•40
@DavidDHDH
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

Hello community ! This is my solution for my first challenge.

Looks simple but I got 2 issues :

  • how to center vertically my card ? I've tried using Flexbox but as the body doesn't have height it' still at the top (so I've put a margin-top 100px)
  • my card looks contract after uploading, compare to my screenshot and the render in my IDE, any idea ?

Let's go for the second one now !

Community feedback

  • Matthew•60
    @unhommequidortPosted over 1 year ago

    You can add a height: 100vh property to the body to make it take up 100% of the window's visible vertical space.

    Marked as helpful
    0
    David H.•40
    @DavidDHDHPosted over 1 year ago

    Thanks a lot ! Works perfectly @unhommequidort

    1

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