HTML HTML Forms Choosing Options Create Checkboxes

JJ T
JJ T
6,276 Points

HTML-Forms

I really don't know what I'm doing wrong????

Add labels for the two checkboxes that say "Fast Shipping" and "Subscribe to Newsletter". Then add lines after the labels.

index.html
<!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>
      <label>Shirt Size:</label>
      <input type="radio" id="small" value="small" name="shirt_size"><label for="small">Small</label><br>
      <input type="radio" id="medium" value="medium" name="shirt_size"><label for="medium">Medium</label><br>
      <input type="radio" id="large" value="large" name="shirt_size"><label for="large">Large</label><br>



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


      <input type="checkbox"  id="shipping"  value="fast_shipping">
     <label for="shipping" class="light" >Fast Shipping<label><br>

      <input type="checkbox"  id="newsletter" value="subscribe">
       <label for="newsletter" class="light">Subscribe to Newsletter</label><br>



   </form>
  </body>
</html>

2 Answers

Hey JJ, here is the correct code, hope it helps:

  <!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>
  <label>Shirt Size:</label>
  <input type="radio" id="small" value="small" name="shirt_size"><label for="small">Small</label><br>
  <input type="radio" id="medium" value="medium" name="shirt_size"><label for="medium">Medium</label><br>
  <input type="radio" id="large" value="large" name="shirt_size"><label for="large">Large</label><br>

  <input type="checkbox" id="shipping" value="fast_shipping" name="shirt_size"><label for="large">Fast Shipping</label><br>
  <input type="checkbox" id="newsletter" value="subscribe" name="shirt_size"><label for="large">Subscribe to Newsletter</label><br>

  <button type="submit">Place Order</button>
</form>
  </body>
</html>
Bibek Shakya
Bibek Shakya
10,434 Points

I see 2 major issue in your code.

  1. Place the submit button before closing </form> tag.
  2. <label> tag is not closed in 'Fast Shipping'. Should be <label for="shipping" class="light">Fast Shipping</label><br>