Video Background Cover CSS Only

by Milomir Topic

HTML

<video id="vid" video autobuffer>
  <source id="mp4" src="https://cb-blog-prd.s3.amazonaws.com/PerformCB_210929_mp4.mp4" type="video/mp4">
</video>

CSS

html, body {width: 100%; height:100%; overflow:hidden;}

#vid{
position: absolute;
  top: 50%; 
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  min-width: 100%; 
  min-height: 100%; 
  width: auto; 
  height: auto;
  z-index: -1000; 
  overflow: hidden;
}