Skip to content
Submitted over 1 year ago

QR Code card, desktop first developped, only HTML and css

MonsieurBoubou•70
@l3miage-bouvier5
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 ! If somebody can answer those questions i would be glad:

  • I struggled a with the shadow, is there a tip to manage them better ?

  • As you can see, my card is not exactly in the middle of the page, i don't know how to do it...

  • Do me code respects clean code conventions ?

Thanks a lot (I am french sorry if my english is terrible)

Community feedback

  • P
    DBan3•70
    @DBan3Posted over 1 year ago

    Hi, I am also new to Front-End but I can maybe help.

    The shadow is fine, I've been doing it that way too.

    Card in the middle issue: try expanding body to the full height of the screen and then centering should work I think.

    Also the code is readable and clean.

    Marked as helpful
    0
    MonsieurBoubou•70
    @l3miage-bouvier5Posted over 1 year ago

    @DBan3 Thanks a lot ! i'll try this body thing right now :)

    0
    P
    DBan3•70
    @DBan3Posted over 1 year ago

    @l3miage-bouvier5

    Let me know how it goes!

    You can easily do it with vh and vw instead of 100% or rem values, the vh is viewport height, and vw is viewport width, so basically the size of the browser.

    Marked as helpful
    0
    MonsieurBoubou•70
    @l3miage-bouvier5Posted over 1 year ago

    @DBan3 Thanks ! now it looks really close to the model :)

    0
    P
    DBan3•70
    @DBan3Posted over 1 year ago

    @l3miage-bouvier5 Glad I could help! I'm here if You need anything else!

    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