title: Twitter Bootstrap: Stop input field extending beyond well
body: <p>I'm having trouble trying to resolve this issue. The docs say that I should set the span equal to the parent span, however, it extends to the right outside of the well container when I do that. It looks fine when viewed on mobile (extends the appropriate amount to the right, filling the well), however, it doesn't play well on desktop (I want the fields to extend inside the well).</p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;div class="row"&gt;
          &lt;div class="span4 offset4"&gt;
              &lt;div id="login-panel"&gt;
                  &lt;div class="well bordered clearfix"&gt;
                      &lt;div class="text-center"&gt;
                          &lt;div class="page-header" style="border-bottom: none; margin: 0;"&gt;
                              &lt;img src="library/img/logo-01.png"/&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;form method="POST" action="#" accept-charset="UTF-8" class="pull-left"&gt;
                          &lt;legend&gt;App name&lt;/legend&gt;
                          &lt;div class="control-group "&gt;
                              &lt;!-- username field --&gt;
                              &lt;div class="controls"&gt;
                                  &lt;label&gt;Email&lt;/label&gt;
                                  &lt;input class="span4" type="text" name="email" value="" id="email" placeholder="Your email address"&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
  
                          &lt;div class="control-group"&gt;
                              &lt;label&gt;Password&lt;/label&gt;
                              &lt;!-- password field --&gt;
                              &lt;input type="password" name="password" id="password" placeholder="Password"&gt;
                          &lt;/div&gt;
                          &lt;div class="control-group "&gt;
                              &lt;p&gt;
                                  &lt;input class="btn btn-default pull-left" type="submit" value="Sign-up"&gt;
                                  &lt;input class="btn btn-primary pull-right" type="submit" value="Login"&gt;
                              &lt;/p&gt;
                          &lt;/div&gt;
                      &lt;/form&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt; &lt;!-- end row --&gt;
  &lt;/div&gt; &lt;!-- end container --&gt;
  </code></pre>