QR Code Sollution

Solution retrospective
Feedback welcome. Not sure how to solve the padding.
Currently working on the desktop version. In mobile preview it works fine :)
Please log in to post a comment
Log in with GitHubCommunity feedback
- @SecreSwalowtail
Nice work Rasmus,
There are some things you can try:
- Setting the min-height of the body to 100vh will allow the background to fill the whole screen
- Setting the display of the body to flex . This will allow you to center the card on the screen using align-items and justify-content
- You can use border-radius on the image to give it a border similar to the card
- To make the card scale nicely on higher resolutions you can set a max-width to the card. Play around with the values until you are satisfied (try 400px and go from there)
Marked as helpful - @obengkenneth
Your image could use some rounded corners. Please try the border-radius property.
Marked as helpful
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