QR Code Component by Alfraz Ahmed

Solution retrospective
-
Did I set the widths accurately?
-
Is there something you find redundant in my code?
-
Any tips on naming classes.
Thank you
Please log in to post a comment
Log in with GitHubCommunity feedback
- @Blackpachamame
Good job!
Here are some comments that may help you:
- Use
min-height: 100vh
instead ofheight; 100vh
(with this you are restricting a specific height, it can generate unexpected results) - Use semantic tags such as
main
,footer
,figure
, etc, this helps the accessibility and SEO of the site - The
<div class="qr-code-container">
should be<main class="qr-code-container">
- The
<div class="attribution">
should be<footer class="attribution">
- You don't need a
margin: auto 0;
in your.qr-code-container
class, to separate themain
from thefooter
, you can simply place agap: 20px
in thebody
Marked as helpful - Use
- @danielzeljko
I also have trouble with CSS naming and one of the methodologies I found helpful was BEM. I tried to use this in my most recent solution. I think both height and width for the image was supposed to be
288px
.Great use of root and props for resetting the browser defaults as well!
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