Menu icon Foundation
Sticly nav and footer problem

I'm using the sticky nav for a sub-navigation found inside the body element of my build.

My default page looks something like this:

{{> header}}

{{> body}}

{{> footer}}

 

the problem is that the footer breaks the scrolling of the sticky nav and appears floating above elements found in the body.

if I place the {{> footer}} element before the closing sticky-container element within the partial, my page loads and works as intended. 

Is there a workaround where I can keep the footer on the default page and have a working sticky nav? I also don't want the nav to always be visible with an increased z-index.

Sticky Navigationfooter

I'm using the sticky nav for a sub-navigation found inside the body element of my build.

My default page looks something like this:

{{> header}}

{{> body}}

{{> footer}}

 

the problem is that the footer breaks the scrolling of the sticky nav and appears floating above elements found in the body.

if I place the {{> footer}} element before the closing sticky-container element within the partial, my page loads and works as intended. 

Is there a workaround where I can keep the footer on the default page and have a working sticky nav? I also don't want the nav to always be visible with an increased z-index.