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 Card - HTML and CSS

P
Jacksen 350

@jacksen30

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


Hello Fellow Front-End Contributors,

I'm really needing some feedback in the following areas,

  1. Best way to apply the purple filter over the img ?

  2. Should I be using a different break point/s for the media query or is this sufficient ?

  3. Is there a better way to implement this or refactor the current code ?

  4. Anything that you think would be good for me to know when undertaking similar projects in the future ?

Thanks in advance for any help !

I will do my best to pay it forward in the future ! Happy <coding />

Community feedback

vinu cyril 980

@vinuman

Posted

Hello there,

Good job completing the project.

-To apply the purple filter, you can use the CSS property, mix-blend-mode: multiply;

-It sets the blending mode for how an element should blend with its background or neighboring elements.

  • The page looks great on small screens and you can choose to add more breakpoints for the tablet view, if you wish.

  • Hope this helps, happy coding!

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