Responsive stats preview card using CSS Flex

Hey, awesome work on this one. Layout in desktop looks good, though it is smaller, the mobile layout looks fine but some sections have big white-spaces and like what Fluffy Kas said, a bug occurs.

Some suggestions would be:

• Always have a main element that will wrap the main content of the page. The .container selector could use main element instead of div.
• Avoid using height: 100vh on a large container like the .container selector. This makes the element's height only limited to the remaining viewport/screen's height. Remove this or replace it with min-height: 100vh.
• Always have an h1 on a webpage. The h2 text on the left side could be the h1.
• The .stat selector could have used ul element, since those are "list" of information about the user, or an dl element.
• The text like 10k 314 shouldn't be heading element, since it doesn't really add any extra information if it were a heading tag like this one. Just use p tag on it.

Aside from those, just the bug when resizing. Still, great job on this one.

Hey, your solution looks pretty fine but do check it around 700-800px! I believe a reason it looks a bit funny because you have a fixed height of 100vh on the container.

Thank you for the suggestions. Looking forward to make the changes and to hear another set of suggestions. I have just only started using frontendmentor. I think it will help me to learn from my mistakes to improve the knowledge.