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

Four Card Page using Flexbox

Semi_Squareβ€’ 80

@Semi-Square

Desktop design screenshot for the Four card feature section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Just practicing my skills. Feedback more than welcome!

Community feedback

Lucas πŸ‘Ύβ€’ 104,420

@correlucas

Posted

πŸ‘ΎHello Semi_Square, congratulations for your new solution!

Your solution is just amazing and really responsive. I can tell that you've paid a lot of attention to the responsiveness.

Something you can improve is the box-shadow that is too dark, to create smooth shadows ever use low opacity and increase the blur value. Here's a good value for the card shadow box-shadow: 0 0.9375rem 2.625rem -0.6875rem rgb(131 166 210 / 40%);

If you're not familar to box shadows you can this online tool create the shadow design and just drop the code in the css: https://www.cssmatic.com/box-shadow

πŸ‘‹ I hope this helps you and happy coding!

1

Semi_Squareβ€’ 80

@Semi-Square

Posted

@correlucas Thanks a lot for the feedback! Also this website for box shadows is amazing, thanks!

1
Lucas πŸ‘Ύβ€’ 104,420

@correlucas

Posted

@Semi-Square @Semi-Square You're welcome, happy to hear that was helpful!

0

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