Single Price Grid Component Using CSS Grid
Design comparison
Solution retrospective
Hi everyone! I think I did my best on this. Feedback on how I can improve will be much appreciated.
Community feedback
- @romila2003Posted about 2 years ago
Hi Kingsley,
Congratulations 🎉 for completing this challenge, the chart component looks great and responsive. There are some issues/suggestions I want to address:
- The
a
tag cannot be nested within thebutton
tag therefore I would recommend you choosing one of those options. - To make your button look more like a button, you can use the
cursor
property so that it looks clickable e.g.cursor: pointer;
- For your media query, the value of your
min-width
property is too large therefore I would recommend you using a smaller value such as1000px
or900px
. It does not have to reach 1440px until you make the card responsive. - In mobile screen, the cards don't have enough padding therefore the texts and elements are all on the left side. Also, you can give your cards a
border-radius
like you used in desktop mode.
Overall, great attempt and wish you the best for your future projects so keep coding 👍.
Marked as helpful0@ArthurKingDevPosted about 2 years ago@romila2003 I appreciate your feedback. I learnt a lot from this single piece. Would update my code ASP.
1 - The
- @maro-ogPosted about 2 years ago
Good job bro. I like how your codes are arranged. I'm a newbie in the web dev community and i'm also a student PT at BUK. I'll be glad if we can link up on twitter. Looking forward to your reply.
0@ArthurKingDevPosted about 2 years ago@maro-og thanks for the commendation! Link to my twitter account : https://twitter.com/arthurkings0097
0@maro-ogPosted about 2 years ago@ArthurKingDev Thanks for the reply. I'll definitely get in touch.
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