Overlay with display none but disrupt the page for mobile

Design help General
1

Hi everyone,

I have been designing some modal overlays and have been working perfectly fine without disrupt the page.

Until when I created this overlay (class name: share-download-mobile-bg), it somehow “block” the whole page from interacting. This feature is only for tablet mobile responsive.

I have been checking and compare the settings from the working modal overlay and the new overlay. Both are in exact same settings yet the outcome is different.

Been trying to troubleshoot for days. Please help :sweat:. Thank you.

My preview site: https://preview.webflow.com/preview/quorse?preview=92d2a5d8954dddf0691d5d1fc56572e8

2

You have a very long page with many elements, please include screenshots of your problem.

3

I found out that when I set it (the dark overlay) to display none, it is still can be seen. Could it be bug issues?

1249×932 140 KB

4

Okay I just found out the problem and solved it.

If I use the Visibility, it affects the display to get inherit from the Visible.

So therefore, I would have to use Display only on all devices.

5

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.