title: html5 video player size on safari browsers
body: <p>I've got a problem on Safari browser (PC/MAC) with a HTML5 <code>video</code> player element.</p>
  
  <p>The problem is that the played video does not reflect the real video of the video <code>source</code> elements, neither does the size specified with the <code>width</code> and <code>height</code> attributes.</p>
  
  <p>Here is the demo URL:</p>
  
  <p><a href="http://actisku.videohosting.fr/test.html" rel="nofollow">http://actisku.videohosting.fr/test.html</a></p>
  
  <pre><code>&lt;video id="homepage_videoplayer" poster="http://actisku.videohosting.fr/medias/videos/v_actisku_visualproject_sephora_61.png" loop="loop"  autoplay="autoplay" width="979" height="365"&gt;
       &lt;source src="http://actisku.videohosting.fr/medias/videos/v_actisku_visualproject_sephora_61.mp4" type="video/mp4" /&gt;
       &lt;source src="http://actisku.videohosting.fr/medias/videos/v_actisku_visualproject_sephora_61.ogv" type='video/ogg; codecs="theora, vorbis"' /&gt;
  &lt;/video&gt;
  </code></pre>
  
  <p>The <code>mp4</code> source file is 979x365. So is the player <code>video</code> element which is also specified at that same size. But it should be read at the same size. </p>
  
  <p>Maybe it's a metadata problem, but I don't know how to edit this metadata.</p>
  
  <p>EDIT: </p>
  
  <p>With JavaScript , I can see the video <code>width</code> is 649 on Safari and 979 on Chrome, pretty strange. So I'm planning to use <code>-webkit-transform</code> <code>scaleX()</code> to fix that.</p>