I'm trying to implement Bootstraps Affix feature in a sticky subnav.
<div class="container" data-spy="affix" data-offset-top="417" id="subnav">
I've adjusted the offset to ensure there's no "skip" or "jump" when the subnav sticks. However, the issue I'm facing is that the content below the subnav jumps up the page, under the nav/subnav, because the subnav changes from relative to fixed and loses its computed height.
Is there a way to resolve this? My initial idea is to add/remove a class to the next div for adding the correct padding or margin.
Here's a jsfiddle to better demonstrate the issue. Watch how the H2 behaves as you scroll.