Extra space while hide/show using dynamic panels

Hello experts,

I am designing an expandable and collapsible sidebar.
I am using dynamic panels to do sub-menu options. Basically hiding and showing to reveal on select change.

Problem I am facing is, the last two links are pushed by the extra space which is because of the hidden panel inside my panel. Everything works fine till i go for third level menu.

Main menu --> UX Standards --> Page Layout -->

Can I please get a help around this? Some input that I can use to rectify! Maybe I am missing something here.
Here’s my file
collapsible menu.rp (152.0 KB)

Hi! It looks like you’re using the “Push pull sandwich” method to allow the nested content to push the outer links, but the OnSelected action is toggling the nested content before the parent panel is hidden and re-shown. Cutting and pasting the toggle action from your OnSelectedChange event to be in between the “Hide” and “Show” in your OnClick event appears to do the trick and allow the panel to properly resize without the gap and extra pushing:

Hopefully that helps!

Hi Alyssa,

Thanks for reply. Now that you point it out, I can see I messed up the sequence.
Thanks a lot :slight_smile:

Here’s my completed interaction