title: Twitter Bootstrap - Vertically align input with label inside control-group
body: <pre><code>&lt;div class="control-group"&gt;
      &lt;label class="control-label "&gt;Date of purchase as detailed on your receipt&lt;/label&gt;
      &lt;div class="controls"&gt;
          &lt;div class="input-append"&gt;
              &lt;select name="invoice_date" value="2013-06-28" required="required"&gt;
                  &lt;option value=""&gt;Please Select&lt;/option&gt;
              &lt;/select&gt;
              &lt;button type="button" class="btn info btn-primary" data-help="invoice_date"&gt;i&lt;/button&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I tried a few solutions and one kind of worked using position absolute, but this affected other areas of bootstrap in particular when it gets responsive.</p>
  
  <p><a href="http://jsfiddle.net/tGZLd/" rel="noreferrer">http://jsfiddle.net/tGZLd/</a></p>
  
  <p>I am trying to get the input to line up with the center of the label that has been pushed over multiple lines but in the best practice of bootstrap.</p>
  
  <p>Or should I simply give up and force it to display a full width label with the input underneath?</p>
  
  <p>Any insight would be great, thanks!</p>