Learn Accessibility by Building a Quiz - Step 33

[jazzycoder]

          <ul class="answers-list">
            <li>
              <label for="q1-a1">
                <input type="radio" id="q1-a1" value="true" />
                True
              </label>
            </li>
            <li>
              <label for="q1-a2">
                <input type="radio" id="q1-a2" value="false" />
                False
              </label>
            </li>
          </ul>
        </fieldset>
      </div>
      <div class="question-block">
        <p>2</p>
        <fieldset class="question" name="html-question-two">
          <legend>
            A label element nesting an input element is required to have a
            for attribute with the same value as the input's id
          </legend>
          <ul class="answers-list">
            <li>
              <label for="q2-a1">
                <input type="radio" id="q2-a1" value="true" />
                True
              </label>
            </li>
            <li>
              <label for="q2-a2">
                <input type="radio" id="q2-a2" value="false" />
                False
              </label>
            </li>
          </ul>

I also tried this in CSS mode, and it didn’t work.

q1-a1, question {}
q2-a2, question {}

[jazzycoder]

I’m having issues with completing this step. Any help would be appreciated!

“Group the relevant inputs together such that only one input from a pair can be selected at a time.”

[hbar1st]

the idea of grouping radio buttons comes from wanting the user to be prevented from selecting multiple buttons for the same question where you just want them to select one.
(for eg. a true and false question cannot both be true and false)
So to accomplish this you should add a name attribute to the buttons that need to be grouped together and give the name attribute the same value for both buttons.