title: Bootstrap 4, navbar fixed-top and other sticky-top elements
body: <p>Here the reproduction: <a href="https://jsbin.com/lawafu/edit?html,output" rel="noreferrer">https://jsbin.com/lawafu/edit?html,output</a></p>
  
  <p>Is this a bug? A mistake? A problem? An unrealizable idea?</p>
  
  <p><strong>Before scroll:</strong>
  <img src="https://user-images.githubusercontent.com/21275217/39126721-57ec229c-4703-11e8-91f4-8a7de5ef046d.PNG" alt="before"></p>
  
  <p><strong>After scroll:</strong>
  <img src="https://user-images.githubusercontent.com/21275217/39126720-57d19620-4703-11e8-81cc-da8c6ce45d5d.PNG" alt="after"></p>
  
  <p><strong>What I need</strong>:</p>
  
  <p>Obviously I need to see the sidebar when I scroll down the page, using padding-top of the body for the fixed-top navbar.</p>
  
  <p>I'm using this code for the sidebar:</p>
  
  <pre><code>&lt;div class="sticky-top"&gt;
    &lt;ul class="list-group"&gt;
      &lt;li class="list-group-item active"&gt;Cras justo odio&lt;/li&gt;
      &lt;li class="list-group-item"&gt;Dapibus ac facilisis in&lt;/li&gt;
      &lt;li class="list-group-item"&gt;Morbi leo risus&lt;/li&gt;
      &lt;li class="list-group-item"&gt;Porta ac consectetur ac&lt;/li&gt;
      &lt;li class="list-group-item"&gt;Vestibulum at eros&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>