Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML HTML Forms Choosing Options Create Radio Buttons

Cynthia de Waal
Cynthia de Waal
1,250 Points
Posted by Cynthia de Waal
Cynthia de Waal
1,250 Points

Challange task 3 of 5 Radio buttons

I'm stuck on this message:

Bummer! You need to add a <label> element within the <form> element, right before the first radio button.

task: add a label above the radio button group that says "shirt size" dont associate it with any specific element

My code:

<form action="index.html" method="post">
  <h1>Shirt Order Form</h1>
  <label for="color">Shirt Color:</label>
  <select id="color" name="shirt_color">
    <label>Shirt Size:</label>
    <input type="radio" id="small" value="small" name="shirt_size">
     <input type="radio" id="medium" value="medium" name="shirt_size">
     <input type="radio" id="large" value="large" name="shirt_size">
    <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>
  <button type="submit">Place Order</button>
</form>

I've tried several times in different ways but keep getting this message. Does anyone know the answer so I can continue.

3 Answers

Christian Andersson
Christian Andersson
8,712 Points

Hi Cynthia,

your final code should look like this:

<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>
  <label>Shirt Size:</label>
  <input type="radio" id="small" value="small" name="shirt_size">
  <input type="radio" id="medium" value="medium" name="shirt_size">
  <input type="radio" id="large" value="large" name="shirt_size">
  <button type="submit">Place Order</button>
</form>

Your error was that the select tag had several input and label tags inside it. Select tags should only ever wrap option tags.

Good luck!

Rich Bagley
Rich Bagley
25,869 Points
Rich Bagley
Rich Bagley
25,869 Points

Hi Cynthia,

Can you try moving the following out of your <select id="color" name="shirt_color"> tag please?

    <label>Shirt Size:</label>
    <input type="radio" id="small" value="small" name="shirt_size">
     <input type="radio" id="medium" value="medium" name="shirt_size">
     <input type="radio" id="large" value="large" name="shirt_size">

Has that made any difference?

Thanks

-Rich