Design comparison
Solution retrospective
Faced some major challenges while trying to build this.
- Would like some feedback on the image section of the card. I built it using background-image and linear-gradient which I feel is quite unnecessary here. Some other method to get the image using the img element?
-Also got quite huddled up in flexbox when the card gets to the breakpoint. Think it's alright now.
If there are any other issues, please feel free to criticize.
Community feedback
- @shashreesamuelPosted over 2 years ago
Hey Beats-Ayush Good job completing this challenge. Keep up the good work
Your solution looks great when compared to the design however I think your line break should be applied before the text
help.I hope this helps,
Cheers, Happy coding 👍
Marked as helpful1 - @SamadeenPosted over 2 years ago
Great Work Ayush Nath!
You can add a filter or blend your image to give it the sample effect.. You can also scale down your container a little to make your card smaller.. Overrall you need very nice..
Happy coding!!!
Marked as helpful1 - @Sdann26Posted over 2 years ago
Hi, Ayush Nath!
Personally to get to make the effect with the color that is with the image I got it with the following property in CSS. That's what I can recommend for my part, good luck.
https://developer.mozilla.org/en-US/docs/Web/CSS/mix-blend-mode
Marked as helpful1
Please log in to post a comment
Log in with GitHub
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