100％高度帆布基础5 [英] 100% Height Off-Canvas Foundation 5

问题描述

我正在使用Foundation，并且有一系列的高度：100％。

I'm using Foundation and have a series of sections at height: 100%.

我使用画布外菜单，但它只匹配第一部分/视口的高度。因此，一旦滚动，画布外菜单将不再与视口的高度对齐。

I'm using the off-canvas menu but it's only matching the height of the first section / the viewport. So once I scroll, the off-canvas menu is no longer aligned to the height of the viewport.

这是一个类似的问题， Foundation 5的画布全高度设备。

It's a similar issue to Foundation 5 off-canvas full height of device.

我结束了这个：

所有好

向下滚动到下一部分

我想可以通过添加position：fixed到left-off-canvas-menu来解决，但是这不行。

I think it can be solved by to adding position: fixed to left-off-canvas-menu, but that's not working.

这让我疯狂。

推荐答案

发现到目前为止是添加几行css：

The best option I can find so far is to add a couple of lines of css:

        .off-canvas-wrap, .inner-wrap {
            min-height: 100%;
        }

        .off-canvas-wrap{  
        height: 100%;
        overflow-y: auto;
        }

虽然这大部分修复它，但触摸设备上的滚动不是100％完美，每时每刻你会得到一个奇怪的情况，浏览器的底部向上拖动。

Although this fixes it for the most part, scrolling on a touch device is not 100% perfect, every now and then you do get a weird scenario where the bottom of the browser drags upwards.

这篇关于100％高度帆布基础5的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！