Rafi -
I didn't want to use 100vh, because that would push the footer down "below the fold" even if there was not much content in the main container div and result in a bunch of unnecessary white space.

But, to your point - we've ended up not using equalizer... not because it wasn't an effective solution for determining the height of more static page elements, but because we have dynamic content changing one of the divs the equalizer is watching. What would happen is that the equalizer would calculate the height it needed to be, based on whatever div was greater, but after that occurred, dynamic content was added to the DOM that would overlap the footer because the equalizer wan't accounting for it.

Strangely, if you resize the page, even a little bit, equalizer would recalculate the height and adjust to the new content.

As I am typing this, it is very difficult to explain, but I am confident that if you and I were sitting in the same room, it would be very clear. All that to say, we'll just use a css solution to be sure the sidenav always extends to the footer. Sorry for the confusion, it was a weird problem. Nothing wrong with equalizer, nothing wrong with our layout, just the order in which the javascript was loading content was causing conflicts.

Okay, I think I see what you are saying.

When the off-canvas menu itself is longer than the content, that simulates what I am going for, but doesn't achieve it completely, because you can still scroll on the main page itself as well.

The way I fixed it with Foundation 5 was by having JS that would change the body tag to overflow:hidden when the off-canvas was engaged. Then, when you closed the off-canvas menu, it would remove overflow:hidden.

I am sure there is a way to do this in Foundation 6 - I am just not sure how to make that happen with the new release. If there is a css/scss solution that would achieve the same thing, I'd be happy to try it out, but so far I haven't been able to find a solution that wouldn't involve some JS.

Functionally, yes, that is the effect I am going after. But with the template I am working with, I don't know that I want to rely on making the off-canvas-content wrapper 100vh.

My off-canvas menu is located beneath my header and above my footer. I only want the middle section to be pushed to reveal the off-canvas, so that is where my off-canvas-content section is located. If I make that 100vh and then make the off-canvas menu 200vh, then my footer would no longer be visible in many cases where it probably should be.

Here is an image of the way my template is set up and hopefully that will make it more clear what I trying to accomplish. The repeated menu items are just there to simulate a long menu, just FYI.

http://imgur.com/rfQYuyS

Thank you for your quick reply, but if possible, I may need to explore a different option.

Tim, thanks so much. That works on links with no destination, but in the case of my link that takes the user to a new page, the page appears to load without any animation being triggered.

What I was going for was some indication that the drawer is closing before the new page is loaded . . . but I am not sure if that is possible.

Does the distinction make sense? That code closes the menu fine - but it won't start to close the menu and take me to a new page if the link has a destination.