Design comparison
SolutionDesign
Community feedback
- @hitmorecodePosted about 1 year ago
Congratulations well done. It seems you didn't get the image overlay. This is how you can fix it
/* add this to the css to make the overlay work */ picture { position: relative; } picture::before { content: ""; width: 100%; height: 100%; background-color: #aa5cdb; position: absolute; top: 0; right: 0; mix-blend-mode: multiply; opacity: 0.9; } /* you can remove this */ /* img { filter: opacity(0.5) drop-shadow(0 0 hsl(277, 64%, 61%)); height: 100%; object-fit: cover; } */
Marked as helpful1
Please log in to post a comment
Log in with GitHubJoin 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