简体繁体 English

在画布外菜单中更改高度会导致水平滚动

[英]Changing the height in my off-canvas menu causes horizontal scrolling

原文 2013-01-10 00:06:37 8 1 javascript/ css/ mobile/ menu

I've got an off-canvas menu, and it's working very well for my Mobile layout. 我有一个非画布菜单，它对于我的移动版式非常有效。

However, when I expand the menu item to show the submenus under it, the whole page can scroll horizontally. 但是，当我展开菜单项以显示其下的子菜单时，整个页面可以水平滚动。 Not so perfect. 不太完美。

I'm just controlling the class name to display: block. 我只是控制要显示的类名：块。

http://dev.martinilab.com/so1/index.html http://dev.martinilab.com/so1/index.html

I'm not sure what is causing the problem. 我不确定是什么引起了问题。

1 个解决方案

The problem is that you don't have a height set on .row , so it's as tall as the content forces it to be. 问题是您没有在.row设置高度，因此它与内容强制的高度一样高。 When you display:block that class and cause those menu items to be displayed, it forces the content further down, and since the page is as tall as the content, the page gets longer. 当您display:block该类并导致显示那些菜单项时，它会迫使内容进一步降低，并且由于页面与内容一样高，因此页面会更长。

If you want to fix it, either set a height for that class or take those menu items out of the document flow so it doesn't push the content down. 如果要修复此问题，请为该类设置一个高度，或者将这些菜单项从文档流中删除，以免将其压低。