Design comparison
SolutionDesign
Solution retrospective
All Feedbacks are Welcome.
Community feedback
- @correlucasPosted about 2 years ago
πΎHello Asif, congratulations for your new solution!
Your solution is almost finished and I've some tips for you:
1.Insert the property
max-width: 1110px
to avoid the container to grow too much:.container { max-width: 1110px; display: flex; flex-direction: row; justify-content: space-between; margin: 10%; background-color: hsl(244, 38%, 16%); border-radius: 10px; }
2.To add the exact same purple overlay effect for the image, matching the design files you can user,
filter
,background-blend-mode
ormix-blend-mode
(the best choice in my opinion). See the code belowimg { mix-blend-mode: multiply; opacity: 0.8;}
π I hope this helps you and happy coding!
0
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