Overlapping Elements with Hover Feature

I am currently using Wix editor. How can I fix overlapping elements from “regular view” when I am using the “hover” feature.

I have 10 boxes in regular view and need each box to show their own unique summary when hovered over.

I already looked and organized all the layers, but I still receive certain boxes overlapping even though they are underneath the layer needed to be “front” view.

I have attached a reference picture of what its suppose to look like and a second picture the issue I am experiencing.

Thank you!

Hi, @Deirdre_Sutor !!

I believe the issue you’re experiencing is likely due to a layering(stacking order) problem. However, before addressing that, it might be worth reconsidering whether the current layout is truly user-friendly. Having a large summary box overlaying ten smaller boxes could simply be making hover interactions more difficult. :slightly_smiling_face:

If you wish to keep the current layout, one possible solution would be to pin the summary box to a fixed position on the screen or place it inside a lightbox. This would help avoid layering conflicts.

That said, my personal suggestion would be to create a dedicated summary display area beneath each group of five boxes. This area would normally be hidden, and when a user hovers over one of the boxes, the corresponding summary would appear and the page would scroll to it automatically. I think that would make the interface more intuitive and easier to use. :innocent:

1 Like