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 using Flexbox

P

@frankgomezdev

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


Looking for any feedback and best practices on semantic HTML, CSS used, and a11y.

Community feedback

@ratul0407

Posted

@frankgomezdev congrats on completing this challenge🎉🎉

You've done a really great job. There's not a lot to complain about👍. But,

  • the padding you've set to .container of 2rem is actually shrinking your container. You can just remove it and it looks more like the design.
  • It's such a small challenge and there wasn't a lot of space to add landmarks but you've done enough. The footer you've added is good but you've commented out the .attribute😅. I know this mistake 'cause I've also done a couple of times. Uncomment it and remove the .attribute div as you are using a footer
  • And the last nick pick that I can say, and it's completely my personal opinion that there are too many div element on the page. You can consider making the top box a article.

I hope you found this helpful👍👍

Happy coding and have a very nice day😄

Marked as helpful

0

P

@frankgomezdev

Posted

@ratul0407 Thank you so much for the feedback. Very helpful and I will implement these tweaks, have a nice day!

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