Dynamically changing UI element position so objects dont overlap?

I have 2 UI elements(element 1 & element 2). My problem is that when I expand one, let’s say element 1, it overlaps over the one below him…I want that at runtime when I click and expand a element the ones below him move down a bit and when I close that element they move back up.125327-1a.png

125328-2a.png

Put those elements in a container panel and add a Vertical Layout Group component to that container.