title: How do I adjust Bootstrap 3 inline form width?
body: <p>I have a form that relies on Bootstrap 3:</p>
  
  <p><img src="https://i.imgur.com/O6exW7A.png" alt="Imgur"></p>
  
  <p><strong>full working example</strong>: <a href="http://jsfiddle.net/x7vk7/2/" rel="nofollow noreferrer">http://jsfiddle.net/x7vk7/2/</a></p>
  
  <p>The gist is that I have 2 columns for content. The first column is <code>col-lg-4</code>, and the second is <code>col-lg-8</code>. The first column displays a form, and the 2nd column displays results.</p>
  
  <p>The problem I'm having is related to the width of the inline form elements in the Cases question. I used <a href="https://stackoverflow.com/questions/18429121/inline-form-nested-within-horizontal-form-in-bootstrap-3">this post</a> to figure out how to properly nest inline form elements in a horizontal form. Here's the relevant code I have for the Cases question:</p>
  
  <pre><code>&lt;div class="form-group"&gt;
      &lt;label class="col-lg-2 control-label" for="id_current_case_count" data-placement="top" data-toggle="tooltip" title="How many cases have you seen?"&gt;Cases&lt;/label&gt;
      &lt;div class="col-lg-10"&gt;
          &lt;div class="form-inline"&gt;
              &lt;div class="form-group"&gt;
                  &lt;input class="form-control" id="id_current_case_count" min="0" name="current_case_count" type="number" /&gt;
              &lt;/div&gt;
              ±
              &lt;div class="form-group"&gt;
                  &lt;input class="form-control" id="id_case_count_uncertainty" min="0" name="case_count_uncertainty" type="number" /&gt;
              &lt;/div&gt;
              &lt;div class="form-group"&gt;
                  &lt;select class="form-control" id="id_case_count_interval" name="case_count_interval"&gt;
                      &lt;option value="weekly"&gt;per week&lt;/option&gt;
                      &lt;option value="total"&gt;total&lt;/option&gt;
                  &lt;/select&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The problem is that I want all 3 form elements for the Cases question to be on the same line. The first 2 elements are just integer fields, so it's not necessary for them to be very wide. What's the proper way to adjust the width of those first two integer fields so that all 3 fields fit on the same line?</p>