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

@NikNT

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


Hey everyone!

This was a nice challenge and I have tried to keep the overall output similar to the design.

There is some issue with the mobile layout. When I access this app in Safari, the border radius is not shown. But, in Chrome, it is all correct. This is a critical issue I am facing.

As always, I am open to suggestions to help me improve the code.

Keep Coding!

NT

Community feedback

hitmorecode 6,230

@hitmorecode

Posted

Nice looks good. I can't help you with the safari problem, I myself am a Linux user so I don't have safari to my disposal to check the problem. I do have one tip for you. If you add mix-blend-mode: multiply; on the overlay and set the opacity: .8; the overlay will look closer to the design file.

Marked as helpful

1

@NikNT

Posted

@hitmorecode

Thanks for the great advice. I’m gonna give it a try right now.

✌🏽

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