Skip to content
Submitted about 2 months ago

Single Price Grid Component

P
LVL 2
Sabine184
@SabineEmden
A solution to the Single price grid component challenge

Solution retrospective


What are you most proud of, and what would you do differently next time?

I did this challenge as another refresher after a longer break from learning web development. My CSS Grid skills are still a bit rusty, but I'm getting back into the swing of things.

What challenges did you encounter, and how did you overcome them?

In the mobile design, the hight of the first row is determined by its content. The second and third row have equal hight. At first, I wasn't sure how I could implement that with CSS Grid. After looking up possible values for grid-template-rows on MDN, I was able to match the design by using the auto keyword for the height of the first row and 1fr for the second and third row.

What specific areas of your project would you like help with?

I focused on HTML and CSS foundations and on CSS Grid. I appreciate any feedback and recommendations for improvement.

Code
Loading...

Please log in to post a comment

Log in

Community feedback

No feedback yet. Be the first to give feedback on Sabine’s solution.

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