Stats Preview Card Component Solution

Solution retrospective
I'm proud of successfully building a responsive layout using flex
and media queries. Next time, I would avoid using vw
for the article
width to prevent layout issues on smaller screens.
I had trouble with media queries and the image overlay. On smaller screens, the layout didn’t adapt well, and the colored overlay on the image stopped working. I fixed the layout by adjusting the breakpoints and dimensions, and I applied mix-blend-mode
and opacity
for the image effect. However, I still need help making the overlay look consistent on all devices.
Please log in to post a comment
Log in with GitHubCommunity feedback
- @DevRobertCodes
I had similar problem but I used the mix -blend: multiply
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