QR Code using HTML and CSS

Please log in to post a comment
Log in with GitHubCommunity feedback
- P@MikDra1
If you want to make your card responsive with ease you can use this technique:
.card { width: 90%; max-width: 37.5rem; }
On the smaller screens card will be 90% of the parent (here body), but as soon as the card will be 37.5rem (600px) it will lock with this size.
Also to put the card in the center I advise you to use this code snippet:
.container { display: grid; place-items: center; }
Hope you found this comment helpful 💗💗💗
Good job and keep going 😁😊😉
- @cmoiss
Hi, how are you?
I think you can use variables in CSS to store your colors and make your code a bit more user-friendly. It also helps you avoid getting lost in hex or hcl codes.
Instead:
background-color: #fff; color: #7b879d;
Try this:
:root { --baby-blue: hsl(212, 45%, 89%); --blueish-gray: hsl(216, 15%, 48%); --navy-blue: hsl(218, 44%, 22%); } [...] background-color: var(--baby-blue); color: var(--navy-blue);
Here is an article from W3Schools that teaches you how to use variables in CSS.
I hope this helped, even if a little (I'm still starting here at FrontEnd Mentor).
Happy studying! :)
- @DanyalSarwar325
I have created the QR code using html and css
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