Awkward bars on top right of HTML5 video in full screen/landscape mode in Chrome on Android OS

1
votes

I am experiencing an issue in Chrome browser on Android operating systems, there are some bars that appear when the video is played in full screen mode on landscape. The bars are present on this video: https://www.w3schools.com/html/html5_video.asp and you may see a screenshot taken from a Samsung Galaxy S9 below.enter image description here

Are these bars meant to be there? What is their purpose / what do they symbolize if so?

2
htmlvideohtml5-videohtml5-fullscreen
they are there because the aspect ratio of the video does not match the screen, so it shows black bars in the area(s) where there is nothing to show... this is like when you watch an old 4:3 movie on a 16:9 TV you get the black vertical bars either side, or a widescreen movie (21:9) you get them top and bottom (aka 'letterboxing') - Offbeatmammal
i am talking about the white lines in the top right - User14289

2 Answers

1
votes

it is a (new) control that reacts to a tap/swipe to show the main Android navigation UI even when in full-screen (disappears along with the rest of the controls)

It appears via the shadow dom as video::-internal-media-controls-display-cutout-fullscreen-button in an element <input type="button" pseudo="-internal-media-controls-display-cutout-fullscreen-button" style=""> but it appears (similar to some other shadow dom elements) resistant to styling at the moment.

-1
votes

It's for those who have a notch. You have to tap it, and it will shift the video, so the notch won't disturb you when watching the video.