Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Challenge 3|| Stats preview card

@SachinMulgir

Desktop design screenshot for the Stats preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


All kinds of feedbacks and suggestions are welcome. Thank You!

Community feedback

@vonryanpogi

Posted

Good job completing the challenge, i have some feedbacks on the solution:

1.To make it responsive you would need to use @media queries change the flex-direction of <main> on small screens (min-765) to column.

2.Use flex-direction to column reverse in your <main>, so that the image will go first before you .textbox class.

3.You might also want to look into using semantic HTML tags like section or article. Would have been a much better option compared to having div all over your entire markup.

4.If you still a little bit confused you can take a look at my solution and learn from it. https://vonryanpogi.github.io/stats-preview-card-component-1st-attempt/

I hope my feedback helps you, happy coding.

0

@SachinMulgir

Posted

@vonryanpogi i am new to this and yet to learn how to make responsive sites. I take it as valuable feedback. Thank you for your suggestion.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord