hi. no help button for this challenge. so pasting the error, and the step and my code. says the id is not set to the textarea, but it is. so can some one help me out. if i have not got the correct code for the challenge, then point it out to me and then show me how to have the exact example. so pasting the error the step to the challenge, and my code. not passing. yes reset the lesson a bunch of times. looked up on google and code looks similar to mine. so just frustrated. totally blind and use jaws 2025. and vs code. help!
ps: pasting below.
You should give the textarea
element an id
attribute.
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="styles.css" />
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="A detailed accessible quiz form." />
<title>Accessibility Quiz</title>
</head>
<body>
<header>
<img src="https://cdn.freecodecamp.org/platform/universal/fcc_primary.svg" id="logo" alt="freeCodeCamp" />
<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 action="https://freecodecamp.org/practice-project/accessibility-quiz" method="post">
<section role="region" aria-labelledby="student-info">
<h2 id="student-info">Student Information</h2>
<div class="info">
<label for="name">Name:</label>
<input type="text" id="name" name="name" />
</div>
<div class="info">
<label for="email">Email:</label>
<input type="email" id="email" name="email" />
</div>
<div class="info">
<label for="date">Date:</label>
<input type="date" id="date" name="date" />
</div>
</section>
<section role="region" aria-labelledby="html-questions">
<h2 id="html-questions">HTML Questions</h2>
<fieldset class="question">
<legend>HTML is used to structure content on the web.</legend>
<ul class="answers-list">
<li>
<label for="q1-a1">
<input type="radio" id="q1-a1" name="html-q1" value="true" />
True
</label>
</li>
<li>
<label for="q1-a2">
<input type="radio" id="q1-a2" name="html-q1" value="false" />
False
</label>
</li>
</ul>
</fieldset>
<div class="question-block">
<label for="dropdown-html">Which HTML element is used to create a dropdown list?</label>
<select id="dropdown-html" name="dropdown-html" required>
<option value="">--Please choose an option--</option>
<option value="div"><div></option>
<option value="select"><select></option>
<option value="input"><input></option>
<option value="form"><form></option>
</select>
</div>
</section>
<section role="region" aria-labelledby="css-questions">
<h2 id="css-questions">CSS Questions</h2>
<div class="formrow">
<div class="question-block">
<label for="favcolor">Choose your favorite color:</label>
<input type="color" id="favcolor" name="favcolor" />
</div>
<div class="answer">
<label for="textbox">Briefly explain the purpose of the <label> element:</label>
<textarea id="textbox" name="textbox" rows="4" cols="50"></textarea>
</div>
<div class="question-block">
<label for="range">Rate your CSS skills:</label>
<input type="range" id="range" name="css-skill" min="1" max="10" />
</div>
</div>
<div class="question-block">
<label for="dropdown-css">Which CSS property is used to change the text color of an element?</label>
<select id="dropdown-css" name="dropdown-css" required>
<option value="">Select an option</option>
<option value="color">color</option>
<option value="background-color">background-color</option>
<option value="font-size">font-size</option>
</select>
</div>
<fieldset class="question">
<legend>CSS is used to control the style of a web document.</legend>
<ul class="answers-list">
<li>
<label for="q2-a1">
<input type="radio" id="q2-a1" name="css-q1" value="true" />
True
</label>
</li>
<li>
<label for="q2-a2">
<input type="radio" id="q2-a2" name="css-q1" value="false" />
False
</label>
</li>
</ul>
</fieldset>
<p>You have finished the quiz.</p>
</section>
</form>
</main>
</body>
</html>
You have linked to step 40 of Build a Quiz Webpage but your code is different from the seed code.
If you reset the step, it is asking you to do 2 things:
- Link the label element and its corresponding textarea element.
- Add a name attribute to the text area element.
To do the first, you link in a similar way to how you have already linked inputs to its corresponding label such as this one:
<label for="q2-a1">
<input type="radio" id="q2-a1" name="q2" value="true" />
Work out from the above how to link the label to a corresponding input element and apply the same method do the textarea element. Textarea is a type of input element.
hi. okay, trying again, did try google. and then looked at my code and some one elses code. so if my code does not look the same as the challenge, then tell me how to get it to shows the same way. so pasting the error below. i have no duplicate ids for the text area, and the ids are unique. and so what am i doing wrong? how to get this to pass? using a screen reader jaws and totally blind. so someone be gentle with me and how to get this to pass. have tried about 40 or more times. yes reset the lesson, and still stuck. so how to get this to pass. will paste the error and my code below. can any one help me out, the last person i asked, was not very helpful and did not point out what i had to change to get it to have the same as the challenge prievew. marvin.
ps: pasting the error and my code below.
You should give the textarea
element an id
attribute.
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="styles.css" />
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="A detailed accessible quiz form." />
<title>Accessibility Quiz</title>
</head>
<body>
<header>
<img
src="https://cdn.freecodecamp.org/platform/universal/fcc_primary.svg"
id="logo"
alt="freeCodeCamp"
/>
<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
action="https://freecodecamp.org/practice-project/accessibility-quiz"
method="post"
>
<section role="region" aria-labelledby="student-info">
<h2 id="student-info">Student Information</h2>
<div class="info">
<label for="name">Name:</label>
<input type="text" id="name" name="name" />
</div>
<div class="info">
<label for="email">Email:</label>
<input type="email" id="email" name="email" />
</div>
<div class="info">
<label for="date">Date:</label>
<input type="date" id="date" name="date" />
</div>
</section>
<section role="region" aria-labelledby="html-questions">
<h2 id="html-questions">HTML Questions</h2>
<fieldset class="question">
<legend>HTML is used to structure content on the web.</legend>
<ul class="answers-list">
<li>
<label for="q1-a1">
<input type="radio" id="q1-a1" name="html-q1" value="true" />
True
</label>
</li>
<li>
<label for="q1-a2">
<input type="radio" id="q1-a2" name="html-q1" value="false" />
False
</label>
</li>
</ul>
</fieldset>
<div class="question-block">
<label for="dropdown-html"
>Which HTML element is used to create a dropdown list?</label
>
<select id="dropdown-html" name="dropdown-html" required>
<option value="">--Please choose an option--</option>
<option value="div"><div></option>
<option value="select"><select></option>
<option value="input"><input></option>
<option value="form"><form></option>
</select>
</div>
</section>
<section role="region" aria-labelledby="css-questions">
<h2 id="css-questions">CSS Questions</h2>
<div class="formrow">
<div class="question-block">
<label for="favcolor">Choose your favorite color:</label>
<input type="color" id="favcolor" name="favcolor" />
</div>
<div class="answer">
<label for="info-purpose"
>Briefly explain the purpose of the <label> element:</label
>
<textarea
id="info-purpose"
name="info-purpose"
rows="4"
cols="50"
></textarea>
</div>
<div class="question-block">
<label for="range">Rate your CSS skills:</label>
<input
type="range"
id="range"
name="css-skill"
min="1"
max="10"
/>
</div>
</div>
<div class="question-block">
<label for="dropdown-css"
>Which CSS property is used to change the text color of an element?</label
>
<select id="dropdown-css" name="dropdown-css" required>
<option value="">Select an option</option>
<option value="color">color</option>
<option value="background-color">background-color</option>
<option value="font-size">font-size</option>
</select>
</div>
<fieldset class="question">
<legend>CSS is used to control the style of a web document.</legend>
<ul class="answers-list">
<li>
<label for="q2-a1">
<input type="radio" id="q2-a1" name="css-q1" value="true" />
True
</label>
</li>
<li>
<label for="q2-a2">
<input type="radio" id="q2-a2" name="css-q1" value="false" />
False
</label>
</li>
</ul>
</fieldset>
<p>You have finished the quiz.</p>
</section>
<section role="region" aria-labelledby="final-thoughts">
<h2 id="final-thoughts">Final Thoughts</h2>
<div class="formrow">
<label for="feedback">Do you have any feedback?</label>
<textarea
id="feedback"
name="feedback"
rows="4"
cols="50"
></textarea>
</div>
</section>
</form>
</main>
</body>
</html>
hi, is this topic closed or is my screen reader jaws not reading me the correct info. using google chrome. please let me know asap.
marvin.
hi, is this post closed. if so, maybe merge it or reopen it. have tried to get this to work. but totally stumped. help!
If it was closed then you would not be able to keep posting replies to it!
You seem to always have a problem with having code that does not match. You have been instructed to use the Reset button in the past in order to start the step again and be able to get the original seed code in place. Every step has a help button which will be shown when you have attempted the exercise three times, and every step has a reset button. (So if there was no help button there that means you ought to try the step a few more times).
Please spend more time reading through the responses you are receiving and try to absorb the information.
The last code you posted still does not match the seed code given for this step. Therefore, you will need to click Reset and attempt to follow the instructions in the step once more.
If you have a question about that, let us know.
hi, i did reset it. okay maybe try the editor and then try to then edit the code. not all pages have the help button, not on challenge 40. and totally blind and using a screen reader. so be gentle. if you cannot be civil, then maybe get some one else to help me out and have my code look the same as the challenge. have tried, and totally stumped.
need help.
marvin.i..
hi. got it to work. did not have a textarea id and name and id for the label. fixed that. sorry. it is working now.
marvin.