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

@hellotobitoun

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


This was a great design to work on and it was really challenging. I have just started learning how to properly use Grid and Flexbox. I initially tried using grid for this project but I got stuck, so I switched to flexbox which after designing became a nightmare when I used media query to get the cards to stack one upon the other.

I took a break from it all together and started the project again from scratch, with some help from Kevin Powell's YouTube channel. I wanted to also use custom properties for my CSS and I was in a hurry the previous day, but I took my time on day 2 to set each style up in my :root and started working up from there.

Cleaning up my code the way I did and properly organizing each class into its respective group helped make my process a lot better in the updated code.

Community feedback

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