Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML HTML Forms Choosing Options Create a Select Menu

The Berserker
The Berserker
19,737 Points

Help with challenge task 3 of 4 in Choosing Options!

And the questions asks: Add a label element to the select menu with the text "Shirt Color:" Here is what I have:

<form action="index.html" method="post">
  <h1>Shirt Order Form</h1>
  <select id="color" name="shirt_color">
    <label id="color">Shirt Color:</label>
    <option value="red">Red</option>
    <option value="yellow">Yellow</option>
    <option value="purple">Purple</option>
    <option value="blue">Blue</option>
    <option value="green">Green</option>
    <option value="orange">Orange</option>
  </select>
</form>

</body> </html>

11 Answers

Logan R
Logan R
22,989 Points

The label should be before the select option.

You need to change the id to for.

<label for="color">Shirt Color:</label>

Hope this helps! (I tried it and it worked.)

Label needs to go before ID label.... id ....

Robert Rydlewski
Robert Rydlewski
3,827 Points

Your comment is the best here :) Thank you so much :)

Joe Treacy
Joe Treacy
1,555 Points

Same problem here. Although I've done everything in this post right and it keeps telling me 'Bummer! You need to add a label for the 'color' select element.' <form action="index.html" method="post"> <h1>Shirt Order Form</h1> <select id="color" name="shirt_color"> <label for="color">Shirt Color</label> <option value="red">Red</option> <option value="yellow">Yellow</option> <option value="purple">Purple</option> <option value="blue">Blue</option> <option value="green">Green</option> <option value="orange">Orange</option> </select> </form>

Logan R
Logan R
22,989 Points

You need to switch your label and select tags. It should look like this:

      <h1>Shirt Order Form</h1>
      <label for="color">Shirt Color</label>
      <select id="color" name="shirt_color">
        <option value="red">Red</option>

The label needs to come before the input.

Everything is correct except for the spelling of Label.

<label for="color">"Shirt_Color"</label>

The Berserker
The Berserker
19,737 Points

O my gosh thank you so much! I guess I have been on too long! Have a great day man!

i still don't understand this task. Can someone please write it out? Thanks

Logan R
Logan R
22,989 Points

After you complete task 2, you have this completed:

<form action="index.html" method="post">
      <h1>Shirt Order Form</h1>
      <select id="color" name="shirt_color">
        <option value="red">Red</option>
        <option value="yellow">Yellow</option>
        <option value="purple">Purple</option>
        <option value="blue">Blue</option>
        <option value="green">Green</option>
        <option value="orange">Orange</option>
      </select>
    </form>

You task is to add an element called "label". Label comes before a form element and tells the user what the form element is used for. The "For" attribute in the label aligns with the 'id' attribute in the form element. If you have this element, when you click on the words "Shirt Color", it will focus on the form element.

Example:

<label for="color">Shirt Color</label>

<input id="color">

I hope this kinda clears it up for you!

Cyrill Meier
Cyrill Meier
5,561 Points

<html> <head> <meta charset="utf-8"> <title>HTML Forms</title> </head> <body>

<form action="index.html" method="post">
  <h1>Shirt Order Form</h1>
  <lable for="color">Shirt Color:</lable>
  <select id="color" name="shirt_color">
    <option value="red">Red</option>
    <option value="yellow">Yellow</option>
    <option value="purple">Purple</option>
    <option value="blue">Blue</option>
    <option value="green">Green</option>
    <option value="orange">Orange</option>
  </select>
</form>

</body> </html>

Please help me, I can't see my mistake!

<label for="color">Shirt Color:</label> Correct answer.

<form action="index.html" method="post"> <h1>Shirt Order Form</h1> <label for= "color" id="Shirt_Color">Shirt Color:</label> <select id="color" name="shirt_color"> <option value = "red">Red</option> <option value = "yellow">Yellow</option> <option value = "purpule">Purpule</option> <option value = "blue">Blue</option> <option value = "green">Green</option> <option value = "orange">Orange</option> </select> </form>

This Answer is working

HIDAYATULLAH ARGHANDABI
HIDAYATULLAH ARGHANDABI
21,017 Points
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>HTML Forms</title>
  </head>
  <body>

    <form action="index.html" method="post">
      <h1>Shirt Order Form</h1>
       <label for="color">Shirt Color:</label>
      <select id="color" name="shirt_color">

        <option value="red">Red</option>
        <option value="yellow">Yellow</option>
        <option value="Purple">Purple</option>
        <option value="Blue">Blue</option>
        <option value="Green">Green</option>
           <option value="Orange">Orange</option>

      </select>
    </form>

  </body>
</html>