title: Css background video
body: <p>Does someone know how to center this video background?</p>
  
  <p>I tried:</p>
  
  <pre><code>margin: 0 auto;
  text-align: center;
  </code></pre>
  
  <p>So far but none of these worked.</p>
  
  <p>This is my code.</p>
  
  <p>Html:</p>
  
  <pre><code>&lt;video autoplay loop poster="polina.jpg" id="vid"&gt;
  &lt;source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.webm" type="video/webm"&gt;
  &lt;source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" type="video/mp4"&gt;
  &lt;/video&gt;
  </code></pre>
  
  <p>Css:</p>
  
  <pre><code>video#vid {
   position: fixed; right: 0; bottom: 0;
   min-width: 100%; min-height: 100%;
   width: auto; height: auto; z-index: -100;
   background: url(polina.jpg) no-repeat;
   background-size: cover;
   margin: 0 auto;
  }
  </code></pre>
  
  <p>How do i center this video background so it removes on the left/right side the same amount if you resize the window? Thanks for helping!</p>
  
  <p>Here is my jsfiddle: <a href="http://jsfiddle.net/pwxcvxe8/2/" rel="noreferrer">http://jsfiddle.net/pwxcvxe8/2/</a></p>