This is a solution to the QR code component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Note: Delete this note and update the table of contents based on what sections you keep.
- Solution URL: Add solution URL here
- Live Site URL: Add live site URL here
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- Mobile-first workflow
Thanks to the QR card project, I now have a clear understanding of when and how to use margin
, padding
, and display: flex
. I had to refer to the documentation to fully grasp how flex
works, but I’m confident that next time, I’ll be able to build layouts using flex
without external guidance. Additionally, my understanding of the box model has improved, especially how margin: auto auto
works.
After completeting this lessons, I got a chance to fill the gaps in my knowledge. I need to work on -
- HTML code semantics
- image related css
display : flex
and its properties
- MDN docs