DEV Community

Discussion on: 5 star rating system - ACTUALLY accessible, no JS, no WAI-ARIA and Semantic HTML! ⭐⭐⭐⭐⭐ [Easily converted to any framework too!]

Collapse
 
link2twenty profile image
Andrew Bone

Just noticed a problem on @afif 's version so came here to see if you have the same problem, and you do, but @madsstoumann doesn't 😲

Using the radio buttons the up and down arrow keys are inversed. Up makes the rating go down and vice versa.

Because Mads is using a range element it behaves as expected.

Collapse
 
grahamthedev profile image
GrahamTheDev

It is expected behaviour though as you are cycling through a list of radio controls. If you inline radio inputs the behaviour is the same.

To be fair if user testing said it was an issue then our old friend JS can rescue us 😀