Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

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

@l3miage-bouvier5

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

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

@DBan3

Posted

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

@l3miage-bouvier5

Posted

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

0
P
DBan3 70

@DBan3

Posted

@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

@l3miage-bouvier5

Posted

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

0
P
DBan3 70

@DBan3

Posted

@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
Discord logo

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