title: Error in HTML form when using <label> tag
body: <p>I am making a web form which I have working and am simply trying to style it using CSS before building a site for it. I have found that after adding label tags I am getting errors when I click on another box it jumps to the First Name box, the only way to fill out the form is to use Tab.</p>
  
  <p>my HTML:</p>
  
  <pre><code>&lt;label&gt;
  &lt;form action="Register Keys site/form.php" method="post"&gt;
  First Name: &lt;input type="text" name="first_name"&gt;&lt;br&gt;
  Last Name: &lt;input type="text" name="last_name"&gt;&lt;br&gt;
  Email: &lt;input type="text" name="email"&gt;&lt;br&gt;
  Phone Number: &lt;input type="text" name="phonenumber"&gt;&lt;br&gt;
  Information on Key: &lt;input type="text" name="keyinfo"&gt;&lt;br&gt;
  Password: &lt;input type="text" name="password"&gt;&lt;br&gt;
  Password Hint: &lt;input type="text" name="passwordhint"&gt;&lt;br&gt;
  &lt;textarea rows="5" name="message" cols="30" placeholder="Please add any additional comments here"&gt;&lt;/textarea&gt;&lt;br&gt;
  &lt;input type="submit" name="submit" value="Submit"&gt;
  &lt;/form&gt;
  &lt;/label&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>label
  {
      float: left;
      text-align: right;
      margin-right: 15px;
      width: 300px;
  }
  
  input
  {
      border:0; 
      padding:5px; 
      font-size:0.7em; 
      color:#aaa; 
      border:solid 1px #ccc; 
      margin:0 0 5px; 
      -webkit-border-radius: 4px; 
      -moz-border-radius: 4px; 
      border-radius: 4px;
      width: 160px ;
  }
  
  textarea
  {
      border:0; 
      padding:5px; 
      font-size:0.7em; 
      color:#aaa; 
      border:solid 1px #ccc; 
      margin:0 0 5px; 
      -webkit-border-radius: 4px; 
      -moz-border-radius: 4px; 
      border-radius: 4px;
      width: 160px ;
  }
  
  input:focus
  { 
      border:solid 1px #EEA34A; 
  }
  </code></pre>