Design comparison
Solution retrospective
I am mostly proud of being able to get everything to look how it should be by using Flexbox for the first time. Next time, I would pay attention to using more semantic HTML.
What challenges did you encounter, and how did you overcome them?Not really any challenges with this one that I can remember.
What specific areas of your project would you like help with?N/A
Community feedback
- @LENI4CPosted about 1 year ago
Your site's dope, as for best practices I think one thing you could've changed in your HTML was the div you created then gave a class of main, there's an actual tag with the name of main, it's a semantic tag that'll function just as the way your div with the class of main worked the main tag is the ideal tag to use in that scenario then in your CSS : .qr-info { margin-top: 20px; margin-bottom: 20px; padding-right: 20px; padding-left: 20px; } I saw you already used the shortcut way of using these but you didn't here, i.e .qr-info { margin: 20px 0 20px; padding: 0 20px; } Or even better you can use the logical properties i.e
.qr-info { margin-block: 20px; padding-inline: 20px; }
Marked as helpful2 - @devusexuPosted about 1 year ago
- Like LENI4C said, using better semantic tags like
main
for the component andfooter
for the attribution. Here is the doc on MDN - Use rem for font-size, here is an article Why font-size must NEVER be in pixels
Marked as helpful1 - Like LENI4C said, using better semantic tags like
Please log in to post a comment
Log in with GitHubJoin 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