title: Bootstrap 4 Sticky top not working
body: <p>I'm designing a sticky top navbar for my website,  I've followed the documentation provided by Bootstrap on their website and looked at previously asked questions on here but I can't get my head round on why its not working. Any help would be great </p>
  
  <pre><code>        &lt;!DOCTYPE html&gt;
  
          &lt;html&gt;
  
  
  &lt;nav class="navbar navbar-expand-sm bg-dark navbar-dark sticky-top"&gt;
      &lt;div class="collapse navbar-collapse justify-content-center" id="navbarNav"&gt;
          &lt;ul class="navbar-nav"&gt;
              &lt;li class="nav-item active"&gt;
                  &lt;a class="nav-link" href="about.html"&gt;ABOUT&lt;/a&gt;
              &lt;/li&gt;
  
  
              &lt;li class="nav-item"&gt;
                  &lt;a class="nav-link" href="#"&gt;CLOTHING&lt;/a&gt;
              &lt;/li&gt;
  
  
              &lt;li class="nav-item"&gt;
                  &lt;a class="nav-link" href="#"&gt;CLOTHING&lt;/a&gt;
              &lt;/li&gt;
  
  
          &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/nav&gt;
  
  
  
  
  
  
      &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.navbar {
      background-color: #2A2F35 !important;
      padding: 0 !important;
  }
  
  /*Navbar Links*/
  
  .navbar-nav a {
      font-family: 'Open Sans', sans-serif;
      font-style: normal;
      font-size: 16px;
      font-weight: 100;
      letter-spacing: 1px;
      color: #ffffff !important;
      padding: 25px;
      margin: 0px 25px 0px 25px;
  }
  
  .navbar-nav a:hover {
      color: #ff6600 !important;
  }
  </code></pre>