Collapsing group giving me a big gap below the footer

I’ve created a menu with collapsing sub-menus on my app to make it easier for users to navigate through some options, however there are so many options that the group the menu is contained in is longer than the page itself, meaning there is a big gap below where I want my footer to be:

As you can see from the photo, my footer is at the top of the screen where the belvoir sign is, but the large menu means I can’t make my page smaller to meet it. The menu will never be this long when live as only one sub-menu can be opened at a time, so this is only a problem in the editor.

Does anyone have any advice how to solve this?

On the parent container (ie. your menu), be sure to check the “Collapse this elements height when hidden” checkbox. As well, be sure to have proper is visible/isn’t visible settings applied to all of the sub menus in addition to collapsing their height when hidden.

That will adjust the height of the menu accordingly.

Thanks for your reply, I have ticked the “collapse the elements height when hidden” box on both the menu as a whole as well as the sub menus in darker red. When the page is live the menu does indeed collapse accordingly, but the page itself is staying the same size as thought it’s not collapsed, meaning I have a massive gap still under the header.

I effectively want to “collapse” the page itself but it’s seeming to be a struggle.

This topic was automatically closed after 70 days. New replies are no longer allowed.