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

#react#tailwind-css#next
CY Chanā€¢ 290

@CYCHAN00

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


Please do not hesitate to tell me if you have any comments, suggestions, or improvements ~ Thanks

Community feedback

P
Daveā€¢ 5,245

@dwhenson

Posted

Hey @CYCHAN00 šŸ‘‹

Lovely job here, and not much to comment on šŸ™Œ, but here's a couple of things to think about:

  • Button vs link? One thing that's worth considering is whether an element is actually a button or a link . The most important thing is what the element will do not what it looks like. This page has a great summary and lots of useful links on this: https://css-tricks.com/buttons-vs-links/ I imagine clicking on 'sign up' would take me to a new page, if you also think that then it should be a link.

  • I'd also get rid of all those br tags inside the square on the bottom right and just put everything inside a ul and make each item an li. I think this would be more semantic as they seem to be a list to me. You will need to remove the default list styling, but once that's done things will appear as they are now, but be better for people using assistive tech to access your site.

Otherwise, keep up the good work and great job! šŸ„³

Cheers Dave

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