How to make tabindex on radiobutton?

Question

HTML

Hey! How can I make tabindex for radio?
Here is the layout:

<div class="b-rating">
                  <div class="b-rating__group"><input class="b-rating__input" type="radio" id="radio5" name="rating" value="5">
                    <label class="b-rating__star" for="radio5" tabindex="5">
                    </label><input class="b-rating__input" type="radio" id="radio4" name="rating" value="4">
                    <label class="b-rating__star" for="radio4" tabindex="4">
                    </label><input class="b-rating__input" type="radio" id="radio3" name="rating" value="3">
                    <label class="b-rating__star" for="radio3" tabindex="3">
                    </label><input class="b-rating__input" type="radio" id="radio2" name="rating" value="2">
                    <label class="b-rating__star" for="radio2" tabindex="2">
                    </label><input class="b-rating__input" type="radio" id="radio1" name="rating" value="1">
                    <label class="b-rating__star" for="radio1" tabindex="1">
                    </label>
                  </div>
                </div>

It doesn’t go to the label, it doesn’t go to the input itself either.
What other ways are there? I saw an article in which the role of a radio button is set for a div, but is this method correct?
js remains?

Answer 1

What do you mean by make "tabindex"? To make an element focus when a tab is pressed?
Radio and so focus. Only if you did not hide it through (you should not do this). Use visuallyhidden . Adding makes the label focusable. If you don’t see this, then most likely you just have focus styles disabled. But using a tabindex value other than 0 \ -1 is highly discouraged. Actually, the most correct solution is to hide the radios themselves through visuallyhidden. The rest is crutches. display: none