HTML5 Video dimensions in Safari IOS

Question

I\'m building a website for a client who\'s majority of content is video. I\'m using the HTML5 video element to display the content but have problems when it comes to Safari

Answer 1

Via CSS, try giving it a width of 100% and a height of auto.

EDIT In this case you need to use JavaScript to wait until the video has loaded the metadata and then read and set the width and height, for example:

var v = document.getElementById('myVideo');
v.addEventListener('loadedmetadata', function(e) {
   this.width = this.videoWidth;
   this.height = this.videoHeight;
}, false);

I haven't exactly tested this but it should lead you on the right track.