Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Learn Challenge: Apply Form Inputs and Labels | Tables and Forms
HTML Essentials

bookChallenge: Apply Form Inputs and Labels

Task

Create an HTML form to collect user information using input fields and corresponding labels.

index.html

index.html

index.js

index.js

copy

Hint

  • Step 1: Provide the correct attributes for each input field by following these instructions:
    • Use the type="text" attribute for the name input;
    • Use the type="email" attribute for the email input;
    • Use the type="password" attribute for the password input;
    • Use the type="date" attribute for the birthday input.
  • Step 2: Ensure that each input field is correctly associated with its corresponding label by following these instructions:
    • For the input with the id="name-field", its corresponding label should have for="name-field";
    • For the input with the id="email-field", its corresponding label should have for="email-field";
    • For the input with the id="password-field", its corresponding label should have for="password-field";
    • For the input with the id="birthdate-field", its corresponding label should have for="birthdate-field".
index.html

index.html

index.js

index.js

copy

Everything was clear?

How can we improve it?

Thanks for your feedback!

SectionΒ 4. ChapterΒ 6

Ask AI

expand

Ask AI

ChatGPT

Ask anything or try one of the suggested questions to begin our chat

Suggested prompts:

Can you show me an example of how the HTML form should look?

What other fields can I add to the form?

Can you explain how to link labels to input fields in more detail?

Awesome!

Completion rate improved to 3.13

bookChallenge: Apply Form Inputs and Labels

Swipe to show menu

Task

Create an HTML form to collect user information using input fields and corresponding labels.

index.html

index.html

index.js

index.js

copy

Hint

  • Step 1: Provide the correct attributes for each input field by following these instructions:
    • Use the type="text" attribute for the name input;
    • Use the type="email" attribute for the email input;
    • Use the type="password" attribute for the password input;
    • Use the type="date" attribute for the birthday input.
  • Step 2: Ensure that each input field is correctly associated with its corresponding label by following these instructions:
    • For the input with the id="name-field", its corresponding label should have for="name-field";
    • For the input with the id="email-field", its corresponding label should have for="email-field";
    • For the input with the id="password-field", its corresponding label should have for="password-field";
    • For the input with the id="birthdate-field", its corresponding label should have for="birthdate-field".
index.html

index.html

index.js

index.js

copy

Everything was clear?

How can we improve it?

Thanks for your feedback!

SectionΒ 4. ChapterΒ 6
some-alt