title: input height:23px makes <p> height:28px :(
body: <p>HTML:</p>
  
  <pre><code>&lt;p&gt;
      &lt;input type="radio" id="SQL:79" name="SQL" value="79" maxlength="300"&gt;
      &lt;label for="SQL:79"&gt;Microsoft SQL Server 2012 Express - 64 bit&lt;/label&gt;
  &lt;/p&gt;
  </code></pre>
  
  <p>relevant CSS:</p>
  
  <pre><code>p {
     line-height:23px; 
     vertical-align:top;
     margin:0 0 8px 0;
     padding:0;
     clear:both
  }
  input {
     margin:0 5px 0 0; 
     padding:0; 
     height:23px;
  }
  input[type="radio"] {
     border:none; 
     background:none;
     vertical-align:text-bottom
  }
  label {
     vertical-align:top
  }
  </code></pre>
  
  <p>My input and label are exact 23px high, however the <code>&lt;p&gt;</code> is 28px :(</p>
  
  <p>When I remove vertical-align from the input, the <code>&lt;p&gt;</code> reduces to 25px; but still not the desired 23px!</p>
  
  <p><b>I have changed the vertical-align on the input[type=radio] from text-bottom to plain bottom/top; this makes the parent p exactly 23px :)</b><br/>
  PS: this line of code comes from the HTML5 boilerplate reset, so be aware!</p>