Box shadow on ion-side-menu-content not visible on iPhone 6+

The shadow on the content is not visible on my iPhone6 plus. It works in the browser (both safari and chrome), the iphone simulator, and on the iphone6.

Anyone had similar problems?

I get the same problem. Can anyone help?

Same problem. Any Solutions to this Issue?

I have the same problem too. Anyone have any ideas? iPhone 6 plus only.

Did anyone ever find a solution? From debugging in Safari, It looks to me like the styles are properly set. I’ve checked other websites to confirm that box-shadow works, at least from within Safari.

Found a solution/hack. Adding border-radius:1px to the element brings the shadows back for some reason.

This saved my life, thanks!

Well, maybe that’s dramatic, but it works for me and I didn’t have to spend forever figuring it out.

(Ionic 4) I dug up the topic but I have the same problem and found a solution who could help others because this topic is well referenced for this problem that is also existing in Ionic 4.

I added some CSS to bypass the problem, just by adding in my global scss file some opacity filter on the background when the menu is open :

.plt-ios {
    .menu-content {
        transition: filter 0.3s;
    }

    .menu-content-open {
        filter: brightness(0.5) !important;
    }
}