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 using basic HTML and CSS

kwokkw 80

@kwokkw

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


The most difficult part of this project is the mix-blend-mode. What is the best practice to code the mix-blend-mode?

I still find difficulty to code the CSS without the design files. Is there any tools/ suggestion to help? How would a professional approach this problem in a real world?

I have been seeing the following CSS reset for image:

img {
    max-width: 100%;
    height: auto;
}

img {
    max-width: 100%;
}

What is the different between the resets with or without height? pros and cons?

Thank yo very much. Any additional comments will be greatly appreciated as always! Mahalo.

Community feedback

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