Responsive QR code component using css flex

• For maintaining images sizes with different layout dimensions : By wrapping the images inside a DIV and giving width:100% for image and for the DIV we use the clamp ( ) method to change the size according to viewport dimensions and suiting different devices' layouts . Other than that, Keep going on & nice work.

Hello @Code-Me-Well!

Your project looks great!

I have a few suggestions for you to improve it:

1 - About font-weight: Instead of using bold, bolder you can give it number values. In the style-guide file, you can check what are the recommended font-weights for the project. I always import all the available weights from Google Fonts and test them until I get the closest result from the original design.

Also, I noticed that you used a h3 for the title. Since that's the main text on the screen and every page should have a h1, you can replace that h3 with a h1. That will help you with the font-weight problem too.

2 - You used 2 different divs for the main content. Unless you have a specific reason to do that, that's not necessary. You can use only one tag and since it's the main content, for semantic purposes, it should be a main tag.

Your project already looks very good, but those suggestions can make it more semantic and also optimize your code.

I hope it helps! 😊

I don't think div have semantic meaning, I think the img should be in a figure tag then placed together with the paragraph inside a main tag. I also don't think you successful imported/linked the outfit font to your stylesheet

Good work!