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

html, CSS, Flexbox and CSS Grid

@amidabrian51

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


Have done this project before. However, have recently been learning about CSS Grid as another solution.

Community feedback

@ovidiuantonio

Posted

Hello, nice solution so far, but there is some space for improvement. These are a few tips to improve your solution:

  • make the sign up button smaller, or center the text if you want to cover all the space to look nicer
  • you can modify the hsl colors to give another color to the bottom right section, so the users can differentiate the sections better
  • you can add the breakpoint for the mobile ver sooner, 375px width is too late and the card gets off the screen

Happy coding! Keep going!

1

@amidabrian51

Posted

@ovidiuantonio Thanks for the advice and they are all valid points. I had done this challenge before but wanted to use CSS grid this time. I will take onboard your comments and apply them to other projects. Especially the one about having more than one media query.

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