I saw online that there were a couple of bugs related to position: fixed and Mobile Safari but I could'nt find any solution to my problem so far.
I have a div with overflow: auto and inside I have a position: fixed element. On desktop, Android, Chrome and Firefox, it works great but when I try to do the same on Safari on an IPhone, the behaviour is completely different and my app is not working.
The position: fixed element is a popup and I want it to take the whole page. Technically in safari it does take the whole page but I can only see part of my popup that is directly over the overflow: auto element. Everything outside the div is transparent. I say technically because the whole popup is still on top of everything but I cannot see it. I can still interact with it though.
I tried to use position: absolute but i my case it's not a viable option since the first element is inside another position relative ou absolute element and it's not goind to do the same thing.
The only option that a can see is to alter the overflow value when the popup is displayed and change it back when I close it.
Is there anything that I missed?