title: Bootstrap 4 Sticky Footer Not Sticking
body: <p>Not really sure why the sticky footer isn't working in Bootstrap 4.   I have a TYPO3 website which I am a beginner at.</p>
  
  <p>The sticky footer is not sticking at the bottom of the page.</p>
  
  <p>Here is a copy of the page source as it has been rendered.</p>
  
  <p>I basically copied the html file from bootstraps docs folder and then modified it and copied it into my TYPO3 template.</p>
  
  <p>If I fill the page with content, the footer does not stick - I have to scroll the page down to see it.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  
  &lt;title&gt;Landing Page&lt;/title&gt;
  &lt;meta name="generator" content="TYPO3 CMS"&gt;
  
  &lt;link rel="stylesheet" type="text/css"
   href="/typo3temp/assets/css/d42b6e1bdf.css?1507853162" media="all"&gt;
  &lt;link rel="stylesheet" type="text/css"
   href="/fileadmin/templates/landing_page/css/bootstrap.min.css?1507860230"
   media="all"&gt;
  &lt;link rel="stylesheet" type="text/css"
   href="/fileadmin/templates/landing_page/css/sticky-footer.css?1507861966"
   media="all"&gt;
  
  &lt;script
   src="/fileadmin/templates/landing_page/js/jquery-3.2.1.min.js?1507862465"
   type="text/javascript"&gt;&lt;/script&gt;
  &lt;script
   src="/fileadmin/templates/landing_page/js/tether.min.js?1507862602"
   type="text/javascript"&gt;&lt;/script&gt;
  &lt;script
   src="/fileadmin/templates/landing_page/js/bootstrap.min.js?1507854311"
   type="text/javascript"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
   &lt;div class="container"&gt;
    &lt;div class="mt-1"&gt;
     &lt;h1&gt;Sticky footer&lt;/h1&gt;
    &lt;/div&gt;
    &lt;p class="lead"&gt;Pin a fixed-height footer to the bottom of the
     viewport in desktop browsers with this custom HTML and CSS.&lt;/p&gt;
    &lt;p&gt;
     Use &lt;a href="../sticky-footer-navbar"&gt;the sticky footer with a
      fixed navbar&lt;/a&gt; if need be, too.
    &lt;/p&gt;
    &lt;div class="row"&gt;
     &lt;div class="col"&gt;1 of 3&lt;/div&gt;
     &lt;div class="col"&gt;1 of 3&lt;/div&gt;
     &lt;div class="col"&gt;1 of 3&lt;/div&gt;
    &lt;/div&gt;
   &lt;/div&gt;
  
   &lt;footer class="footer"&gt;
    &lt;div class="container"&gt;
     &lt;span class="text-muted"&gt;Place sticky footer content here.&lt;/span&gt;
    &lt;/div&gt;
   &lt;/footer&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>