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

Used css grid for practice

JanAbe 230

@JanAbe

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


How does one make the image purple?

I looked at some other frontend mentor's code to see how he did it and copied it partially but don't understand everything.

How to make my solution more responsive, at the moment it looks good on small screens and large screens but not really on those between.

Community feedback

@aykinsancakli

Posted

Hi @JanAbe,

You can use background-image property

  background-image: linear-gradient(
      to right bottom,
      rgba($color-primary-light, 0.8),
      rgba($color-primary-dark, 0.8)
    ),
    url(../img/nat-4.jpg);
  background-size: cover;

So you can add a layer of gradient on top of the image you want 😉.

Cheers,

Aykın

Marked as helpful

0

JanAbe 230

@JanAbe

Posted

@aykinsancakli

Thank you so much for the clear and easy answer!

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