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

Responsive stats-preview page using css grid

Nazaf 140

@Nazaf64

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


Any suggestions for improvements is welcome

Community feedback

Eric Salvi 1,330

@ericsalvi

Posted

Hey Nazaf64,

Pretty solid start and not a whole bunch to improve. I would suggest maybe taking a look at using some CSS filters to get that background image a bit more like the provided solution design.

Take a look at your breakpoint where it seems to jump a bit early which gives a lot of empty space on mobile devices.

Lastly, one thing I like to do is run all of my pure CSS through an autoprefixer like https://autoprefixer.github.io/. What this tool does is generates compatible CSS for all browsers. Since you are using Grid and it is not 100% supported on older browsers.

Great job and keep up the momentum!

1

Nazaf 140

@Nazaf64

Posted

@ericsalvi Thanks for the feedback. Appreciate it! I'll look into it right away.

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