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

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


I think I didn't create the rgba mask correctly and that's why it was unresponsive. I accept help ;)

Community feedback

@catherineisonline

Posted

Looks awesome! I usually remove the copyright thing, doesn't fit the design 😁

Also, if you want to match the image color you can use mix-blend-mode: multiply; opacity: 0.75; for the image and hsl(277, 64%, 61%); for the cover color

Marked as helpful

1

@hernannadotti

Posted

Hi @thgsnake, nice work, maybe you can use it as image background without absolute position, and you missed media queries, that is the reason why the site is unresponsive. Regards

Marked as helpful

1
Oluwatobi 160

@Oluwatobi9034

Posted

It is because you didn't add a media query, you should add a media query, (a max width of 716px or less ) so it can be responsive.

Marked as helpful

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