title: Bootstrap 4 - Sticky footer - Dynamic footer height
body: <p>I need to put a sticky footer on my pages , however i don't have a definite height set for my footer . On smaller screens - the rows resize and footer becomes longer . </p>
  
  <p>Therefore , the default sticky footer example provided on getbootstrap does not work since it requires a fixed footer height.</p>
  
  <p>Any way to implement this ?</p>
  
  <pre><code>/* Sticky footer styles
  -------------------------------------------------- */
  html {
    position: relative;
    min-height: 100%;
  }
  body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
  }
  .footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 60px;
    line-height: 60px; /* Vertically center the text there */
    background-color: #f5f5f5;
  }
  
  
  /* Custom page CSS
  -------------------------------------------------- */
  /* Not required for template or sticky footer method. */
  
  body &gt; .container {
    padding: 60px 15px 0;
  }
  
  .footer &gt; .container {
    padding-right: 15px;
    padding-left: 15px;
  }
  
  code {
    font-size: 80%;
  }
  </code></pre>