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

Stats preview card component with HTML CSS (Flexbox Mobile-First)

Moisesβ€’ 60

@devmoises

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


Practicing all my knowledge of HTML and CSS. I look forward to your good advice. Thanks. My only question is: How to apply the violet color with strong light to the image?

Community feedback

P
ApplePieGiraffeβ€’ 30,545

@ApplePieGiraffe

Posted

Hey there, Moises! πŸ‘‹

Well done on this challenge! πŸ‘

A few things I'd like to suggest are,

  • Making sure the top part of the card component doesn't get cut off the screen when the layout first changes from desktop to mobile.
  • Perhaps decreasing the size of the image a bit when the layout first changes from desktop to mobile so that it isn't so large when the layout transition first happens.

As for getting the purple overlay of the image to look more like that of the original design, I haven't complete this challenge (yet), but here's a nice solution for this challenge that does that pretty well that you might want to take a look at to get some ideas. πŸ™‚

It also might be worth taking a look at your solution report and trying to clear up some of the errors that are there in order to improve the accessibility and semantics of your solution. πŸ˜‰

Hope that is helpful. πŸ˜€

Keep coding (and happy coding, too)! 😁

2

Moisesβ€’ 60

@devmoises

Posted

@ApplePieGiraffe Thank you very much, I will take your recommendations very seriously.

1

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