title: how to get a span class to come up below the label
body: <p>So i am creating basic forms right now and i am having an issue with this little thing that i want someone else to look at for me. Been trying this thing for hours now.</p>
  
  <p>I have a span class that i want to come up below the label. As of right now, the span comes side by side as the label and i want it below the label. Here is my html/css</p>
  
  <p>CSS:</p>
  
  <pre><code>fieldset { width: 900px; }
  input[type=text], select, textarea{width: 100%; }
  span .half {float: left; width: 48%; padding: 1%; }
  .half { float: left; width: 48%; padding: 1%; }
  .full { clear: both; width: 100%; padding: 1%; }
  .clear { clear: both; }
  .right { text-align: right; }
  /*little line breaks that separte sections*/
  .generalinfo { padding-top: 10px;}
  /* Reset CSS */
  html, body, div, span, applet, object, iframe,
  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  a, abbr, acronym, address, big, cite, code,
  del, dfn, em, font, img, ins, kbd, q, s, samp,
  small, strike, strong, sub, sup, tt, var,
  b, u, i, center,
  dl, dt, dd, ol, ul, li,
  fieldset, form, label, legend,
  table, caption, tbody, tfoot, thead, tr, th, td {
      margin: 0;
      padding: 0;
      border: 0;
      outline: 0;
      font-size: 100%;
      vertical-align: baseline;
      background: transparent;
      text-align: left;
  }
  body {
      background: #DCDDDF url(http://pixelmatter.co/img/tweed_@2X.png);
      color: #000;
      font: 14px Arial;
      margin: 0 auto;
      padding: 0;
      position: relative;
  }
  h1{ font-size:28px;text-transform:uppercase;margin-bottom: 2px;}
  h2{ font-size:26px;}
  h3{ font-size:18px;}
  h4{ font-size:16px;}
  h5{ font-size:14px;}
  h6{ font-size:12px;}
  h1,h2,h3,h4,h5,h6{ color:#34495e;}
  small{ font-size:10px;}
  b, strong{ font-weight:bold;}
  a{ text-decoration: none; }
  a:hover{ text-decoration: underline; }
  .left { float:left; }
  .right { float:right; }
  .alignleft { float: left; margin-right: 15px; }
  .alignright { float: right; margin-left: 15px; }
  .clearfix:after,
  form:after {
      content: ".";
      display: block;
      height: 0;
      clear: both;
      visibility: hidden;
  }
  
  
  ::-webkit-input-placeholder {
     color: #808488;
  }
  
  :-moz-placeholder { /* Firefox 18- */
     color: #808488;  
  }
  
  ::-moz-placeholder {  /* Firefox 19+ */
     color: #808488;  
  }
  
  :-ms-input-placeholder {  
     color: #808488;  
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="half"&gt;
         &lt;label for="abc"&gt;abc&lt;/label&gt;
           &lt;span class="half"&gt;abcabc&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>