Apparent bug in Learn Accessibility by Building a Quiz - Step 38

This lesson may have a bug. When submitting the following code lines 91-102, it shows the error “Hint: You should give the label element a for attribute”, but it has that, yet the system isn’t recognizing it. Please fix or let me know if I’m just missing something stupid in this very straightforward markup:

        <div class="question-block">
          <label>Are you a frontend developer?</label>
        </div>
        <div class="answer">
          <label for="subscribe">Subscribe to our mailing list?
          <select name="subscribe" id="subscribe" required>
            <option value="">Select an option</option>
            <option value="yes">Yes</option>
            <option value="no">No</option>
          </select>
          </label>
        </div>

hi, welcome to the forum.

There’s a button with a question mark on it. If you click it, it will open a topic and help you format your code properly for the forum.
It will also include a link to the challenge to allow us to read it conveniently.

Please consider using this button next time.

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.

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

if you click the reset button (which looks like an arrow turning) you will see the original code which was as follows:

            <div class="question-block">
              <label>Are you a frontend developer?</label>
            </div>
            <div class="answer">
              <select required>
                <option value="">Select an option</option>
                <option value="yes">Yes</option>
                <option value="no">No</option>
              </select>
            </div>

You are asked to add a for attribute. That means you should add the for attribute to the label which has the words “Are you a frontend developer?”
The code you added to select looks correct to me, so you just need to fix this issue (where you added an extra label element instead of just adding for attribute to the existing label)

Ok, thanks. The text editor I see has no preformatted code button, like your example shows, so I had used it’s blockquote button, but that had no effect, and still caused the code to be rendered, but at least if it accepts backticks, I can use those for code sections, going forward.

The preformatted code option is sometimes in the cogwheel menu option on the right.

Doh! Thanks again. I mistook the instructions as “add a label”, so the error didn’t seem to make sense, because the label I added had a for attribute, but they wanted it on the existing label.

1 Like

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