Does someone know how to center this video background?
I tried:
margin: 0 auto;
text-align: center;
So far but none of these worked.
This is my code.
Html:
<video autoplay loop poster="polina.jpg" id="vid">
<source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.webm" type="video/webm">
<source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" type="video/mp4">
</video>
Css:
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;
}
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!
Here is my jsfiddle: http://jsfiddle.net/pwxcvxe8/2/