title: Creating a reponsive input form with Bootstrap
body: <p><img src="https://i.stack.imgur.com/1BHKP.png" alt="enter image description here"></p>
  
  <hr>
  
  <p>I am trying to realize the screen shown on the screenshot. But I cannot control the space between elements. I want it to be responsive but I guess I cannot manage the high res screen layout this time. The code is below and I have added a wireframe of the screen.
  When adding some elements with prepend it always ruins my deams :)</p>
  
  <p>link to file: <a href="http://jsfiddle.net/AmhHf" rel="nofollow noreferrer">jsfiddle.net/AmhHf</a></p>
  
  <pre><code>![&lt;div class="container-fluid"&gt;
    &lt;div class="row-fluid"&gt;
      &lt;div class="span8"&gt;
        &lt;h1&gt;Formulate&lt;/h1&gt;
      &lt;/div&gt;
      &lt;div class="span4 pull-right"&gt;&amp;nbsp;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="row-fluid"&gt;
      &lt;form class="well span12"&gt;
        &lt;div class="row-fluid"&gt;
          &lt;div class="span12"&gt;
            &lt;label&gt;Formula Name&lt;/label&gt;
            &lt;input type="text" class="span8"&gt; 
          &lt;/div&gt;
          &lt;div class="span8"&gt;&amp;nbsp;&lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="row-fluid"&gt;
          &lt;div class="span3"&gt;
            &lt;label&gt;My Label&lt;/label&gt;
          &lt;/div&gt;
          &lt;div class="span3"&gt;
            &lt;div class="input-prepend"&gt;
              &lt;span class="add-on"&gt;@&lt;/span&gt;
              &lt;input type="text" class="input-medium"&gt; 
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="span3"&gt;+&lt;/div&gt;
          &lt;div class="span3"&gt;
            &lt;select&gt;
              &lt;option&gt;Option 1&lt;/option&gt;
              &lt;option&gt;Option 2&lt;/option&gt;
              &lt;option&gt;Option 3&lt;/option&gt;
            &lt;/select&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="row-fluid"&gt;
          &lt;div class="span3"&gt;
            &lt;label&gt;My Label&lt;/label&gt;
          &lt;/div&gt;
          &lt;div class="span3"&gt;
            &lt;div class="input-prepend"&gt;
              &lt;span class="add-on"&gt;@&lt;/span&gt;
              &lt;input type="text" class="input-medium"&gt; 
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="span3"&gt;+&lt;/div&gt;
          &lt;div class="span3"&gt;
            &lt;select&gt;
              &lt;option&gt;Option 1&lt;/option&gt;
              &lt;option&gt;Option 2&lt;/option&gt;
              &lt;option&gt;Option 3&lt;/option&gt;
            &lt;/select&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="row-fluid"&gt;
          &lt;div class="span3"&gt;
            &lt;label&gt;My Label&lt;/label&gt;
          &lt;/div&gt;
          &lt;div class="span3"&gt;
            &lt;div class="input-prepend"&gt;
              &lt;span class="add-on"&gt;@&lt;/span&gt;
              &lt;input type="text" class="input-medium"&gt; 
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="span3"&gt;+&lt;/div&gt;
          &lt;div class="span3"&gt;
            &lt;select&gt;
              &lt;option&gt;Option 1&lt;/option&gt;
              &lt;option&gt;Option 2&lt;/option&gt;
              &lt;option&gt;Option 3&lt;/option&gt;
            &lt;/select&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="row-fluid"&gt;&lt;/div&gt;
        &lt;div class="row-fluid"&gt;
          &lt;div class="span3"&gt;
            &lt;label&gt;My Label&lt;/label&gt;
          &lt;/div&gt;
          &lt;div class="span3"&gt;
            &lt;div class="input-prepend"&gt;
              &lt;span class="add-on"&gt;@&lt;/span&gt;
              &lt;input type="text" class="input-medium"&gt; 
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="span3"&gt;+&lt;/div&gt;
          &lt;div class="span3"&gt;
            &lt;select&gt;
              &lt;option&gt;Option 1&lt;/option&gt;
              &lt;option&gt;Option 2&lt;/option&gt;
              &lt;option&gt;Option 3&lt;/option&gt;
            &lt;/select&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="row-fluid"&gt;
          &lt;div class="form-actions pull-right"&gt;
            &lt;button type="submit" class="btn btn-primary"&gt;Submit&lt;/button&gt;
            &lt;input type="reset" class="btn" value="Reset"&gt; 
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/form&gt;
    &lt;/div&gt;
  &lt;/div&gt;][3] 
  </code></pre>
  
  <p>Edit:</p>
  
  <pre><code>&lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
  &lt;title&gt;Pagetitle&lt;/title&gt;
  &lt;link href="css/bootstrap.css" rel="stylesheet" type="text/css"&gt;
  &lt;link href="css/bootstrap-responsive.css" rel="stylesheet" type="text/css"&gt;
  &lt;!-- HTML5 shim for IE backwards compatibility --&gt;
  &lt;!--[if lt IE 9]&gt;
        &lt;script src="http://html5shim.googlecode.com/svn/trunk/html5.js"&gt;&lt;/script&gt;
      &lt;![endif]--&gt;
  &lt;/head&gt;
  </code></pre>