title: Boostrap table footer not displaying at the bottom
body: <p>I have a Bootstrap responsive table in my AspNet Web API project which not showing me foot text within the table. My foot text shows on the top of the page outside table. I mean I'm trying to keep the footer of bootstrap modal to bottom but I can't, this is my html structure:</p>
  
  <pre><code>&lt;div class="container"&gt;
  
  &lt;div class="table-responsive"&gt;
           &lt;table class="table table-bordered table-hover" id="Countries"&gt;
               &lt;thead&gt;
                   &lt;tr&gt;
                       &lt;th&gt;
                           CountryId
                       &lt;/th&gt;
                       &lt;th&gt;
                           CountryName
                       &lt;/th&gt;
  
  
                       &lt;th class="col-md-2"&gt;
                          Action
                       &lt;/th&gt;
                   &lt;/tr&gt;
               &lt;/thead&gt;
               &lt;tbody class="tbody"&gt;&lt;/tbody&gt;
               &lt;tfoot&gt; All text I put here shows at the top of the page outside of the table&lt;/tfoot&gt;
  
           &lt;/table&gt;
       &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>