so in the above there are different containers which are in collapsed state from keyword page Title. i am expecting when the perosn click on container in green or red one of the below container will be displayed on the coding logic which is working fine
but when i am previewing it there is a lot of empty space
It depends on the empty space while in the editor. If the space is over 70px, it will not collapse. If the space is below 70px, it will collapse. Can it be that in design time, the space is over 70px?
Collapse option is working fine … but in the UI when the component is collapsed it is leaving blank space which is filled when component is expanded .
what i want was that when the component is in collpase mode there should be no blank space but it is not happening so
All the collapse containers are in one of the slide .
Is this 70px TOTAL space allowed between different elements for the rule? or each empty space vertically speaking between all the items/elements involved in the collapse?
I have this exact problem on a page of mine and have ensured all of my vertical distances for all collapsible and following items are less than 70px EACH, but my footer shows up out of view below the screen on a 24" monitor… i have also gone as far as making sure every single element within the box that was supposed to collapse, is itself collapsed, to no avail, i still have this huge empty space on initial load of the page before any interactions occur.
In theory, as long as the distances are less then 70px, all elements should move up. Once a single distance is over 70px, any elements below should not move up.
If it does not work that way, send a link to the site / page. We can then make sure if there is something wrong on our side.
Hi Everyone,
I had the same problem and this is how I fixed it.
The big empty space Mr. Japinder is dealing with is because of the PAGE itself, not the containers. Your containers are just fine.
Your page is not collapsing along with your containers because you increased the page Height manually to make room for all of the containers you have… Everybody would do the same, but this will keep your page’s Height permanently FIX ignoring any collapsing objects in it.
In order to make your page collapsible along with your container, you have to SELECT & CUT all of your containers, then reduce the page height manually to its minimum value (drag the footer all the way up) and then INSERT your containers back again. (CUT/PASTE).
After that, you will see how the big empty space below your containers disappear when you collapse the containers… The page will actually collapse below them.
I did open my own post and received the same advice as above and it worked in the end. Also if your items are HIDDEN, that cancels your collapse, thus you get empty spaces.
Hey guys!! I just had the same problem! but it was with a few texts on the mobile version. I tried what Luigino said, but it didn’t work. Luigino still gave me the solution though lol He gave me an idea, and I started to just copy one text and delete it on the desktop version to see which one was the problem. After a few I found the one text that was causing the problem. I copied what the text said/deleted it/added a new text/and pasted it. The problem went away!!
SOLVED!!! I saw it on another post, the solution is to double-click the “Adjust Page Height” handle/button between the page and footer. IMPORTANT, if you grab and slide that handle up or down, then the problem will return. If you have collapsible elements on the page, you cannot slide that handle if you need footer to move up when an element is collapsed. To add space between the last element and footer, DO NOT SLIDE footer down, make the element taller or add empty transparent or hidden box between the last element and the footer and slide that box down to push the footer down.
