Learn-accessibility-by-building-a-quiz/step-20

HTML-CSS
1

I don’t understand what I am doing wrong, I’ve looked at other peoples posts and still am getting this error message:

" You should give the second input element an id attribute matching the for attribute of the second label ."

My 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="Name"><input id="Name">Name</label>
            <input/>
          </div>
          <div class="info">
            <label for="Email"><input id="Email">Email</label>
            <input/>
          </div>
          <div class="info">
            <label for="Birthdate"><input id="Birthdate">Birthdate</label>
            <input />
          </div>
        </section>
<section role="region" aria-labelledby="html-questions">
          <h2 id="html-questions">HTML</h2>
        </section>
        <section role="region" aria-labelledby="css-questions">
          <h2 id="css-questions">CSS</h2>
        </section>
      </form>
    </main>
  </body>
</html>
2

Hi there. Can you please escape your code by using the preformatted text button (Ctrl-E) button in the text editor? Right now I can’t see it. Also please use the “Ask for help” button in the challenge as this helps communicate issues much easier.

3

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

4

Hi! You’re almost done it, but you don’t have to create a new input inside a label, you have it on the next line. Just put the id here, and for good readability and styling add a colon with a space after the text in labels (Text: )

5

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