Collapse calculated margin when collapsing height on hidden element

I have a sidebar with multiple groups one below the other. The groups have margin between each of them, but if I collapse the space for a hidden element the margin stays. This is leaving a gap at the top of the sidebar.

Here’s the editor view

Here’s the live view – notice the extra space at the top. Ideally this would have been bottom margin that collapsed with the hidden collapsed group element.

Did you ever find a fix for this? I have the same issue

My solution for this is to put each element in a parent group that includes the whitespace either above or below the element. This way, when I collapse the parent group it hides the element and one of the spaces between elements.

Thanks Scott. But the issue I still have is that say the 2 groups above the one that is shown in the attached image, are hidden there is still all this extra margin (as shown in the image) which pushes my Twitter group too far down. Any ideas what is causing this?

It’s as though, yes, the groups are collapsed they still leave space there?

Many thanks

If you take a look at the 2 images attached. You will see on the 1st image that the groups are butt-up to each other with no margin between them, but in the 2nd image, when for example the Behance group is hidden/collapsed, that there is this spacing that just throws the alignment that I set in the editor completely out? What is causing this?

butted

margin_issue

I can see in the Inspector where this random, empty Div (the cause of the issue) is…

And if I remove the height in the Inspector it fixes the spacing issue…

Any ideas folks?

Speaking to @marc2 with the spacing issue he is experiencing between each social link has been fixed, below is the solution.

Essentially each of the 3 ‘Group [name of social platform] URL Container’ all need to be contained within a parent group, otherwise it can create gaps as displayed above in past posts, so if you have a group containing all 3 child groups, it locks the gap in when one shrinks in height.

So creating a parent group called ‘Group Social Profile Container’ thats tight around the 3 groups inside resolves this (parent group has no spacing or margin), so when one shrinks, it keeps locked in with the parent group. It sounds fiddly and it is a bit in all fairness, takes some playing around with sometimes.
image

3 Likes

Big thanks to @luke2 for his help on this.