Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Request path contains unescaped characters
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Stats preview card component

P

@asishPatnaik2000

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


What challenges did you encounter, and how did you overcome them?

I had difficulty in mantaining mobile and desktop view for the stats component

What specific areas of your project would you like help with?

CSS

Community feedback

Daniel 🛸 44,230

@danielmrz-dev

Posted

Hey @asishPatnaik2000!

Your project looks great!

I also had a hard time trying the image coloring when I did this project, but I managed to do it like this:

.image {
    background-image: linear-gradient(0deg, #7210af9c, #7210af9c), url('images/image-header-mobile.jpg');
    background-size: cover;
    height: 240px; /* Or other value if necessary */
}

There's also another option using a property called background-blend-mode, but I confess I don't know how to use it very well. I'm mentioning it because you might wanna look into it. 😊

Hope it helps!

Other than that, your project looks fantastic!

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