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

Posted by Steven Jaimangal
Steven Jaimangal
2,656 Points

Im trying to complete the challenge for Stage 3 And it just isnt working... I put the "label" above the radio button.

<label>Shirt Size</label>

<input type>.................Radio Button etc.

Wayne Priestley
Wayne Priestley
19,579 Points
Wayne Priestley
Wayne Priestley
19,579 Points

Hi Steven,

Could you post the full question and your code please.

Here is a link to explain how to use Markdown to post your code How to post code

Steven Jaimangal
Steven Jaimangal
2,656 Points

I am trying to complete the challenge, when im asked to complete the task of adding a label above the first radio button labeled with "Shirt Size:" I can't complete the task, and i don't see the error with my code.... please help :)

Thank you in Advance.

<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" name="shirt_size" id="small" value="small">
            <input type="radio" name="shirt_size" id="medium" value="medium">
            <input type="radio" name="shirt_size" id="large"  value="large">

        <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>
Steven Jaimangal
Steven Jaimangal
2,656 Points

_< I figured it out!!!! i spent and hour trying to fix the error. Thank you Wayne for your response.

3 Answers

Steven Jaimangal
Steven Jaimangal
2,656 Points
Steven Jaimangal
Steven Jaimangal
2,656 Points

Solved

Wayne Priestley
Wayne Priestley
19,579 Points
Wayne Priestley
Wayne Priestley
19,579 Points

Hi Steven,

Can you try,

<label for="shirt-size">Shirt Size:</label>

You may also want to move these down so they are above the colour options.

      <label for="color">Shirt Color:</label>
      <select id="color" name="shirt_color">
Emeka Okoye
Emeka Okoye
2,489 Points
Emeka Okoye
Emeka Okoye
2,489 Points

Hi Steven,

The problem is because you have nested the label and a couple other inputs within a select element. This is syntactically not correct that is why you are getting an error.

This is what it should be:

<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" name="shirt_size" id="small" value="small">
      <input type="radio" name="shirt_size" id="medium" value="medium">
      <input type="radio" name="shirt_size" id="large"  value="large">

      <button type="submit">Place Order</button>
    </form>