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

Single-Price-Grid-Component with Flexbox & Grid

yagnik0 420

@yagnik0

Desktop design screenshot for the Single price grid component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Feedbacks are welcome to enhance my code,

Happy Coding!🫡

Community feedback

@ratul0407

Posted

@yagnik0 Congratulations on completing this challenge🎉🎉

I'm really surprised with your solution it's really great. You chose grid🚀 instead of flexbox you used rems instead of pixels. Plus this is your fifth submission in the last 7 days. That is really awesome✨✨.

For your mobile solution you can tweak a little bit. first from the .grid-container remove the min-height: 35rem that's not necessary and it looks better without it. change the width: 75% or you can use rems for it. Even though you used grid but you still stayed with flexbox for your mobile version and there is nothing wrong about it. But you could've just use a grid-template-rows: repeat(3, 1fr). But it's still great.

I hope it was helpful for you👍👍

Keep up the good work and have a very nice day🙂🙂

Marked as helpful

0

yagnik0 420

@yagnik0

Posted

@ratul0407 Thank you for reviewing my code while giving me your kind suggestions it's really helpful.😊

I'll keep that in mind and change it very soon bro.

But till than more power to you and have a nice day too.💪

Happy Coding!🫡

1

@ratul0407

Posted

@yagnik0 Thank you for your well wishes😄😄

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