I have a modal background div that opens (with a modal layer above it) when I click a link on my page. And it doesn’t cover the entire page when I on my Android phone (4.0.4) zoom in to click the link and then zooms out to see the newly added modal layer.
Steps to reproduce:
1. Zoom in and click the link
2. Now the background and the layer apperes.
3. Zoom out to see the entire layer and page.
4. The background now only covers the zoomed in area, not the entire page.
I’m not adding any CSS other than display: block; with JS to the background.
All of the positioning is done with css:
background: rgba(255, 255, 255, 0.5);
What am I doing wrong?
Note: The site is not responsive and it works in all browsers (Mac/PC, with rgba support) and all iOS versions.
@paulie_d, seriously. It’s not my little hobby project. The site belongs to a big corporation and the project is not for public viewing. I thought I’d ask here and see if someone had encountered the same problem and knew how to fix it with just css.