title: Adding new elements won't make the modal body bigger in Twitter-Bootstraps
body: <p>I have this code:</p>
  
  <pre><code>&lt;div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
       aria-hidden="true"&gt;
      &lt;div class="modal-dialog"&gt;
          &lt;div class="modal-content"&gt;
              &lt;div class="modal-header"&gt;
                  &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;
                      &lt;span aria-hidden="true"&gt;×&lt;/span&gt;&lt;/button&gt;
                  &lt;h4 class="modal-title" id="myModalLabel"&gt;My title&lt;/h4&gt;
              &lt;/div&gt;
              &lt;div class="modal-body"&gt;
                  &lt;div id="problem_desc"&gt;
  
                  &lt;/div&gt;
                  &lt;div id="problem_sol"&gt;
  
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="modal-footer"&gt;
                  &lt;div id="modalbutton"&gt;
  
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Then I use some ajax to fill the divs, something like this:</p>
  
  <pre><code>$('#problem_desc').html('&lt;div class="form-group error"&gt;'+data.problem.problem_description+'&lt;/div&gt;');
  </code></pre>
  
  <p>...</p>
  
  <pre><code>$('#problem_sol').html(&lt;div class="form-group error"&gt; &lt;label for="probselect" 
  
  class="col-sm-3 control-label"&gt;Something&lt;/label&gt;&lt;div class="col-sm-9"&gt; 
  
  &lt;select class="form-control" id="probselect"&gt;&lt;/select&gt;&lt;/div&gt;);
  </code></pre>
  
  <p>I use these functions 2 or 3 times to make a form in the modal</p>
  
  <p>There are several cases of what I want to include in the modal depending on the AJAX response, so I can't just put the form in the modal and fill it with AJAX. I need to create the form dynamically.</p>
  
  <p>I expect the modal's body to expand or contract depending on the amount of divs and columns that I add. This works when I don't add them dynamically.</p>
  
  <p>The problem is that, when added with jQuery, it won't expand or contract and the form will end up in the overlapping the footer.</p>
  
  <p>Any suggestions?</p>