Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

Video stretching not working, video is always scaled inline using CSS3 transform: scale()


Page with videos: http://www.iwm.org.uk/history/handing-over-security-in-afghanistan
JWPlayer version: 6.9

Problem: According to the docs, JWPlayer should default to "stretching: 'uniform'" in case there's no stretching option defined. However, our videos are somehow being scaled down using an inline CSS3 transform: scale()

When you fullscreen those videos, they fill the player fine, but without fullscreen, there's huge black bars on all sides of the video. I've tried all the different stretching options but none of them affect how the video's displayed. I'm not sure where this CSS3 transform's coming from or why it's there. Seems like this has happened quite recently, so maybe some of our CSS changes have affected the video's dimensions. But I can't find anything that might affect the video, as all the parent containers have proper sizing. Could someone help me with this issue?

2 Community Answers

jottevanger

User  
0 rated :

Ok I found it, it looks like the CSS:

video { max-width: 100%; }

makes the video somehow smaller than it's parent container. Removing this fixes the issue. But I have no idea why.

Todd

JW Player Support Agent  
0 rated :

So there was extra CSS on your page that was altering <video> tags? That will usually cause problems for JW 6.

This question has received the maximum number of answers.