Responsive QR code using CSS Flex

What are you most proud of, and what would you do differently next time?

This project helped me ease back into HTML and CSS comfortably, forcing me to look up and research into good practices, using the Discord server to help me from other people's solutions. I depended more on other people's solutions and would've liked to remember HTML and CSS from previous studies and implemented them in this project. However, I didn't remember but this was a good little project to work on as a starting point again!

What challenges did you encounter, and how did you overcome them?

Whenever I'm in need of help, I tend to compare my own code with other people's code and think theirs is better since they were successful instead of working my way round my solution with what I currently have. For example, in this project, I was stuck on making it responsive to the mobile viewport towards the end. Many successful solutions used display: grid and display: block whereas I had already implemented using display: flex in CSS. I tried to search for a solution with no success. However, reading good CSS practices from articles, the Discord server, and stack overflow, I changed the width of the container from a percentage to a measure of rem which seemed to do the trick. It wasn't the optimal way to do so but I was successful and it was what I needed to do in this particular project. If the project was to make the page responsive to various viewports, then I would've considered not using flex in CSS and rewritten the code.

What specific areas of your project would you like help with?

I'd like to have help with making it fully responsive to various viewports. For example, having a viewport less than 375px, and not having to change the rem measurement for my container. How will I be able to do this using the current CSS properties that I have currently?