QR code component using HTML/CSS

Solution retrospective
-
I am quite proud of the way I structure my CSS files and how I use custom properties (variables).
-
Next time I would definitely stay longer on each section before going to another - to prevent constant jumping between them, which can confuse me sometimes.
-
Centering
<main>
vertically but having<footer>
still on the bottom of the page was somehow difficult since I useddisplay:flex;
on<body>
(their parent). -
justify-content: space-between;
put<footer>
on the bottom of the page but<main>
on top, which made it hard to center vertically. -
The solution was to use
flex:1;
on<main>
- which made it take up all the available space and madealign-items: center;
take effect.
Does anyone know any better/more effective way of centering <main>
in the situation I described in the section above?
Please log in to post a comment
Log in with GitHubCommunity feedback
- P@Prasann123
First challenge , took a bit of time but able to achieve it to some extent
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