metafizzy / metafizzy/flickity-fullscreen
iPhone X in landscape mode
- Dominant language
- HTML
- Stars
- 49
- Forks
- 16
- PR merge metrics
- No merged PRs in 30d
Description
When in landscape mode on iPhone X (and presumably XS, XS Max, XR though I don't have those to test with at the moment), the fullscreen dark background doesn't extend fully to the sides of the display. Instead you see your website background bleeding through on the sides.
The issue in general is illustrated on [this page](https://stephenradford.me/removing-the-white-bars-in-safari-on-iphone-x/), though I hope there's also a CSS-specific fix that could be applied to `flickity-fullscreen`, rather than our entire website design.
The image gives you a sense of the issue:

I am able to reproduce this problem [on the fullscreen demo page](https://flickity.metafizzy.co/options.html#fullscreen).
Contributor guide
No contributing guide indexed for this repository
Research direction
Start by reproducing the issue on the fullscreen demo page in landscape mode on an iPhone X, then inspect the fullscreen styling and the CSS-specific behavior described in the linked Safari reference. Done means the dark fullscreen background reaches both sides of the display without the website background showing through, including on the related iPhone models if available.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100