Learn Accessibility by Building a Quiz - Step 32

Tell us what’s happening:
I should give the first label the text True or False. i believe i did that correctly what am i doing wrong?

Your code so far

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="freeCodeCamp Accessibility Quiz practice project" />
    <title>Accessibility Quiz</title>
    <link rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <header>
      <img id="logo" src="https://cdn.freecodecamp.org/platform/universal/fcc_primary.svg">
      <h1>HTML/CSS Quiz</h1>
      <nav>
        <ul>
          <li><a href="#student-info">INFO</a></li>
          <li><a href="#html-questions">HTML</a></li>
          <li><a href="#css-questions">CSS</a></li>
        </ul>
      </nav>
    </header>
    <main>
      <form method="post" action="https://freecodecamp.org/practice-project/accessibility-quiz">
        <section role="region" aria-labelledby="student-info">
          <h2 id="student-info">Student Info</h2>
          <div class="info">
            <label for="student-name">Name:</label>
            <input type="text" name="student-name" id="student-name" />
          </div>
          <div class="info">
            <label for="student-email">Email:</label>
            <input type="email" name="student-email" id="student-email" />
          </div>
          <div class="info">
            <label for="birth-date">D.O.B.<span class="sr-only">(Date of Birth)</span></label>
            <input type="date" name="birth-date" id="birth-date" />
          </div>
        </section>
        <section role="region" aria-labelledby="html-questions">
          <h2 id="html-questions">HTML</h2>
          <div class="question-block">
            <p>1</p>
            <fieldset class="question" name="html-question-one">
              <legend>
                The legend element represents a caption for the content of its
                parent fieldset element
              </legend>
              <ul class="answers-list">
                <li>
                  <label for="q1-a1">True
                    <input type="radio" id="q1-a1" value="True"/>Answer 1.
                  </label>
                </li>
                <li>
                  <label for="q1-a2"> False
                    <input type="radio" id="q1-a2" value="False"/>Answer2.
                  </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"> True
                    <input type="radio" id="q2-a1" value="True" />Answer 3.
                  </label>
                </li>
                <li>
                  <label for="q2-a2"> False
                    <input type="radio" id="q2-a2" value="False" />Answer 4.
                  </label>
                </li>
              </ul>
            </fieldset>
          </div>
        </section>
        <section role="region" aria-labelledby="css-questions">
          <h2 id="css-questions">CSS</h2>
        </section>
      </form>
    </main>
  </body>
</html>
```
type or paste code here
```
 <ul class="answers-list">
                <li>
                  <label for="q1-a1">True
                    <input type="radio" id="q1-a1" value="True"/>Answer 1.
                  </label>
                </li>
                <li>
                  <label for="q1-a2"> False
                    <input type="radio" id="q1-a2" value="False"/>Answer2.
                  </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"> True
                    <input type="radio" id="q2-a1" value="True" />Answer 3.
                  </label>
                </li>
                <li>
                  <label for="q2-a2"> False
                    <input type="radio" id="q2-a2" value="False" />Answer 4.
                  </label>
                </li>
              </ul>
`````````````

**Your browser information:**

User Agent is: <code>Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36</code>

**Challenge:**  Learn Accessibility by Building a Quiz - Step 32

**Link to the challenge:**
https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-accessibility-by-building-a-quiz/step-32

Make sure to check the directions carefully.

Give the label elements text such that the input comes **before** the text.

This wording can be a little tricky, but if you look at the error it gives you in the challenge it should tell you that the text needs to come after the input. Right now, you have it before the input

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.