CODEWITHSUNDEEP
csshtmlgoogle-chromevideostretching
Paul Deehan
Paul Deehan

Reputation: 59

Chrome v52 html5 video's getting stretched?

I've a website that uses standard html5 video tags to pull down videos from cloud storage. All is fine, however since my Chrome browser got updated to v52+ videos are by default getting stretched too wide as if Chrome has an issue with the metadata?

It doesn't affect certain videos though e.g. some videos have been uploaded via iPhones, iPads, Android smartphones or a web browser (I've no issues with any web browser).

The exact same video tag in Firefox and IE (Edge) work fine, the videos are not stretched.

Has anyone come across this and by chance managed to apply any sort of fix be it CSS tricks or other.

I'm sort of hoping the next update to Chrome will fix this issue.

Thanks in advance...

P.

Upvotes: 2

Views: 1243

Answers (1)

saurabheights
saurabheights

Reputation: 4564

This is probably a bug in Chromev52. The sample video for which I faced this problem had SAR(Storage Aspect Ratio) set to 1:1, but the DAR(Display Aspect Ratio) was set to 16:9. Turns out chrome didn't respect the DAR value.

For your video, use this command to check SAR and DAR value.

ffmpeg -i input.mp4

Just to verify if this is a bug, I re-encoded the file to SAR of 16:9. The video now displays properly on Chrome.

To re-encode to a new aspect ratio, try this.

ffmpeg -i input.mp4 -vf scale=iw*16/9:ih output.mp4

Update:-

The issue is due to bug 632624.

Summary:

The video's having rotation metadata, needs to be rotated before displaying. After rotation, the rotated video is stretched to fit the browser. The bug was the size to stretch the video to, is calculated using the unrotated video size, causing the distortion.

Upvotes: 1

Related Questions