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

Stat card preview with html and css

@anthonyidoko

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


my image is in black and white. what should I have done differently? And please point out my errors overall.

Community feedback

Sebastien 290

@Sebystien

Posted

Hi Anthony, Here's a couple of things you might like to try. For the width of the card, you can use a max-width to adjust the size of the card on bigger screen. You don't want it to get too big.

For the img, there are several way you can get it done. For me, I set up a div and use the background: linear-gradient( rgba(color and alpha), rgba(color and alpha)), url(img link)

and you can use a mix-blend-mode. and don't forget to change the font-family and you can add a little bit of padding :)

Enjoy!

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