Hello! I've been awayy from frontend coding for a while because of the college, and thus I forgot somethings and I am studying from the basics again and going through frontendmentor roadmap to help me build the foundations. I've done the QR Code Component challenge today, and I am looking forward to any critiques and tips to improve my skills.
A thing I found hard to do was to match the "bottom" of the card with the design and also to match the text breaklines on the screen sizes mentioned on "style-guide", I was able to think just about using padding-bottom and max-width with ch unit.
Also, I am very insecure about the responsive part, I always struggle on this. Specifically speaking, I don't know if it is properly responsive or accessive, and also if the box or texts sizes should shrink while the screen size decreases, as when the screen width gets smaller then 300px it starts looking weird. I want also to know if it is okay to let the height of the component be as it is, because on really small screens you need to scroll and the card won't fit properly. I also don't know if using max-width with ch on texts is ok.
What would be the proper way to deal with the issues mentioned on the paragraphs above? And, about my html structure, is it alright ? If not, how could I improve it?