Twenty Twenty-One: Background Image Stretch Behavior - iPhone vs Android

[masperber]

Steps to Reproduce

1. Set a site background image with Preset Fill Screen and Image Position Center. (User is using theme Twenty Twenty-One. Not sure if that is relevant.)
2. Create several pages with differing heights, at least some of which exceed the height of the background image.
3. Background image

What I expected to happen

The background image should have the same behavior on all mobile devices.

What actually happened

The background image stretches to fit the height of the page on iPhones, but it maintains 100% horizontal on Androids. This happens regardless of the browser used to view the page.

Context

Customer report: 4254040-zen

HEs using non-iPhone devices are unable to reproduce the customer issue, while HEs using iPhones are able to reproduce the customer's view.

Operating System

Android, iOS

OS Version

iOS 14.7.1, Android versions unspecified

Browser

Chrome/Chromium, Firefox, Safari

Browser Version(s)

No response

Is this specific to applied theme? If so, what is the theme name?

Undetermined. Theme name is Twenty Twenty-One.

Simple/Atomic

Simple

Console and/or error logs

No response

Number of Users Impacted

All users

Available Workarounds

It seems that explicit CSS can resolve the difference in behavior.

Reproducibility

Consistent

Other information

No response

[synora]

Triaged. I'm able to replicate this using an iPhone 11 v 14.7.1.

[mrfoxtalbot]

Thank you for reporting this @masperber!
I believe this is a duplicate of #1421
Closing in favor of that one.