Skip to content
Submitted about 1 year ago

Interactive rating component - HTML-CSS-Javascript

Matthew_S•40
@MatthewCCS
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Interactive rating component
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

What is the best practice for making rating? I used a list but not sure if there is a more efficient way to do it

Community feedback

  • Elyse Kanagaratnam•300
    @elyyysePosted about 1 year ago

    Hey, Matthew - Great question! I think for something like this, radio buttons are your best bet. You give them all the same name, and the browser will automatically ensure the user can only pick one at a time. And since they're an official browser input, you can wrap them and your button in <form> tags and just have the one event listener on submit. You get a bunch of accessibility features for free doing it this way.

    Marked as helpful
    1

Please log in to post a comment

Log in with GitHub

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