I have applied object-fit fill to a video element. This video element spans entire screen and is set to 100vh height and 100vw width. In Chrome and Firefox it works fine and the video is stretched to fill the screen. However on safari object-fit fill does not stretch the video. Object-fit cover works fine, but fill doesn't. This video is set to autoplay.
I have another hidden video element that plays a video on loop and shares the same space as the above mentioned video and is shown when the above mentioned video finishes playing. This video playing on loop stretches on applying obect-fit fill, but the other video doesn't stretch to fill the screen.
Please help me with this. I have tried almost all CSS suggestion with min-height, position:relative, etc. but none have worked.