If you think that it's clever to make radio buttons look like buttons because of accESsiBILiTY, let me tell you that it's not.

[matuzo@front-end.social]

If you think that it's clever to make radio buttons look like buttons because of accESsiBILiTY, let me tell you that it's not. It's confusing af for screen reader and keyboard users.

[matuzo@front-end.social]

I've shared this post a hundred times but it explains the problem well.

Perceived affordances and the functionality mismatch - Tink - Léonie Watson

Tink - Léonie Watson - On technology, food & life in the digital age (tink.uk)

[matuzo@front-end.social]

Also, `display: none` is not how you hide a radio button only visually.

[yatil@yatil.social]

@matuzo Well, it is. But it’s then hidden for everyone.

Can I interest you in a radio button nested inside a button for visual purposes?

[matuzo@front-end.social]

@yatil added "only"

I'm intrigued! I get button in link or link in button all the time but I've never seen a radio button inside a button!

[nhoizey@mamot.fr]

@matuzo do you mean like these?

Angular SelectButton Component

SelectButton is used to choose single or multiple items from a list using buttons.

(primeng.org)

[matuzo@front-end.social]

@nhoizey They're using buttons!

[julienw@pouet.chapril.org]

@matuzo these for example? https://mui.com/material-ui/react-toggle-button/

[matuzo@front-end.social]

@julienw No, that are actual `<button>`s.