QR code component using CSS Flexbox & Mobile-First
Design comparison
Solution retrospective
- Should I put specific font size in html? I’m not quite sure but i read some where they said that it’s not good for user experience because it cause problem for users who are using different browser font size. If yes, Then what is the best practice?
html { font-size: 16px; }
- lighthouse says i should have images explicit width/height. But I already put width 100% of img.
Community feedback
- @Kashyxp-patelPosted about 1 year ago
It's ok to give a font-size in your code but it'll be way better if you use the em or rem units instead of pixel units. Because if some one has changed their default font-size in browser to something else and in your code the font-size uses the pixel unit it'll over-ride their settings and hence won't be a good user experience for them. The 'em' and 'rem' units will dynamically adjust the font size according to the users default font size. (The default font size in browser is 16px..). (https://www.youtube.com/watch?v=fzZTvLmmTzM) this YouTube video helped me in understanding this.
Marked as helpful1@abhishek-baliyan-devPosted about 1 year ago@Kashyxp-patel Thanks for the info & video.
0 - @Islandstone89Posted about 1 year ago
The image needs alt text, that describes the image and where scanning the QR code leads to.
It's better to link to the font in the head of the HTML, instead of importing it into CSS.
1
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