Floating Group from reusable beneath other groups

Hi everyone,

I have a floating group within a reusable element and I am opening this on a page.

I’m using the below code to fix the FG stick to the top of the page.

The issue I have is that the FG appears below all the groups on the page even though I have floating z index set to above elements.

I’ve read elsewhere that because the FG is in a reusable bubble doesn’t actually put the FG above other elements.

I’m wondering if anyone has a solution to this.

Thanks

Simon

#fg_markup { z-index: 999999 !important; position: fixed !important; } .bubble-element.ReusableElement { z-index: 99999 !important; }

I have a single-page app with all reusables…and a lot of floating groups…

but I have all my floating groups on the index page, and then send data to them from the reusable element. This method works fine and is very easy to set up.

The z-index for the floating group will depend on the parent element (in this case the reusable element). I have a similar setup but they are stored in a Header reusable which itself is a floating group.

Also note that you can manage Overlay z-index using the element tree. Anything at the bottom has priority.

In the long run this setup will be better.

1 Like

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