Pixel 4 Landscape Fullscreen: Hiding White Margin?

Hi there,

I’m seeing a white margin during fullscreen landscape mode on the Pixel 4 and am wondering if there’s a way to set the colour of this margin from white to black, or even better scale the screen fully to the full width of the screen as seen for example during fullscreen landscape video playback on YouTube?

This margin is not the nav bar (eg: right side), but on the other side (eg: left side) of the screen and does not occur on a Pixel 2 for example…

Many thanks!
Isaac

Might be related to the safe area/notch for the camera on Android. I don’t have a notch in the screen on Android to check.

In the short term, I would suggest making the page full screen when the user taps ‘Start’ or similar call to action button as suggested here: Making Fullscreen Experiences  |  Web Fundamentals  |  Google Developers

There is also an option on the full screen API to force landscape IIRC.

I have had a quick look on an Android phone with a notch and the left margin is set by the browser window which is shown by the address bar not rendering in that area either.

Unfortunately there is little you can do without going fullscreen

Even after going full-screen the notch still remains. I have a phone with a teardrop notch camera, and even when I install my game as a web app with display set to full-screen, a black notch remains:


I believe this is a browser limitation.

1 Like

Yes, I see that even on a successful fullscreen request the white margin appears on the opposite side of the nav bar on Pixel 4a, this can be seen via the Android Studio emulator as well. My Pixel 2 seems fine.

I also note that even with Dark Theme turned on in Android Settings, the white bar remains white, but the nav bar is correctly coloured dark.

Setting this white margin to be black would be ok, but I’m not quite sure how I might get to that style level…

A Pixel 2 doesn’t have a notch for the front facing camera. It looks like this is an OS level setting and there’s little that we can do at the browser level besides detecting if the OS is in a light or dark theme.

1 Like

Ok, thanks for your support in any case good sirs. :dizzy: