Design comparison
Solution retrospective
hello all, can anyone suggest how i can keep my code simple??
Community feedback
- @rayaattaPosted 10 months ago
hello Bethelπ, congratulations on completing your first FED challenge π
I have some suggestions you might find useful.
1 Try to make your html more Semantic by wrapping the main page content inside a
<main>
tag . Replace<div class="qr-container">
With<main class="qr-container">
. This changes nothing visually but Using it makes all the difference. Using semantic markup improvesSEO
And user experience (accessibility) for people using assistive technology such as screen readers.
2 In order to center the card on any screen add this code snippet to body.
min-height:100vh; display:flex; align-items: center; justify-content: center;
Then remove the margin properties from
.qr-container
I hope this helps π.
Your solution looks great π.
Happy coding βοΈ
0
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