Tell us what’s happening:
Describe your issue in detail here.
**Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Registration Form</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<h1>Registration Form</h1>
<p>Please fill out this form with the required information</p>
<form action='https://register-demo.freecodecamp.org'>
<fieldset>
<label>Enter Your First Name: <input for="first-name"></label>
<label>Enter Your Last Name: <input for id="last-name"/></label>
<label>Enter Your Email: <input for id="email"/></label>
<label>Create a New Password: <input for id="new-password"/></label>
</fieldset>
<fieldset></fieldset>
<fieldset></fieldset>
</form>
</body>
</html>
/* file: styles.css */
body {
width: 100%;
height: 100vh;
margin: 0;
background-color: #1b1b32;
color: #f5f6f7;
}
label {
display: block;
margin: 0.5rem 0;
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:104.0) Gecko/20100101 Firefox/104.0
Challenge: Learn HTML Forms by Building a Registration Form - Step 17
Link to the challenge:
Test
Sorry, your code does not pass. Keep trying.
Hint
The first input
element should have an id
of first-name
.
I find the instructions for this step unhelpful. This module has been updated and in the old version the solution is more obvious.
Step 17
Following accessibility best practices, link the input
elements and the label
elements together using the for
attribute.
Use first-name
, last-name
, email
, and new-password
as values for the respective id
attributes.
Any chance of an example of how to use <input for?
Thanks in advance.