Single Price Grid Component Built With Flexbox & Grid
Design comparison
Solution retrospective
One thing I found (arguably) difficult was attempting to complete the project purely using CSS grid. I don't have much hands-on experience yet and could not achieve the wrapping effect I wanted. I did use grid on the container as an experiment to get more practice, but the rest is built using flexbox. Other than that, I enjoyed this project a lot.
If anyone has any tips or information about how or if I could've built this project entirely with grid, I would be happy to get any tips!
Community feedback
- @danielmrz-devPosted 9 months ago
Hello @S067130H!
You did a very good job there!
I have a very simple suggestion for improvement:
- Since the sign up button is a clickable element, it's nice to add
cursor: pointerto it.
📌 This gives the user one more visual indication that the element is clickable, as obvious as it may look.
I hope it helps!
Other than that, you did a great job!
Marked as helpful1@S067130HPosted 9 months agoHello @danielmrz-dev!
Thank you for bringing that up, I have a bad habit of not setting the cursor property on clickable elements. I’ll get that added on, thank you!
1 - Since the sign up button is a clickable element, it's nice to add
- @CozyMedsPosted 9 months ago
Site looks awesome mate
A quick couple sightings, when shrinking 400px - 510px the text in "Join our community" is overflowing and cutting off, The button shrinking adaptively is awesome but maybe decrease the size so its not stretching end to end, The hover effect is cool but a tad slow, maybe speed it up slightly
Otherwise site looks awesome, keep up the hard work and happy coding bro
Marked as helpful1@S067130HPosted 9 months ago@CozyMeds thanks for pointing that out!
I didn't look carefully at other width sizes so I'll get those few things fixed. I appreciate the feedback!
0 - @Ezekiel225Posted 9 months ago
Hello there 👋 @S067130H.
Good job on completing the challenge !
Your project looks really good!
Keep up the excellent work and continue to challenge yourself with new projects. Your progress is impressive, and each project is a step forward in your front-end development journey! 🚀🌟.
Happy coding.
Marked as helpful1@S067130HPosted 9 months ago@Ezekiel225 thank you for the kind words! I appreciate it a lot. Looking forward to having solutions on my page as good as yours!
0
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