Video is not 100% correct height and width correctly

Navigation
2

I have a problem in my tag video because I wanted to leave it with width:100% and height:100%; but without losing my video quality it would have to look like < a href="http://www.popupdesign.com.br/"> site here I opened some topics related to this subject that was solved in parts because I managed to leave it with the width and height 100% the video stretched and lost its quality currently my video is how I want to put the values I adjust manually and as I am starting to use media queries I am having a lot of difficulties to be able to adapt this in different resolutions follow the code of my video: 

#video {
  width: 100%;
  height: 100%;
}
video {
  height: 100%;
  width: 100%;
  z-index: -100;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: scaley(1.72);
  -o-transform: scaley(1.72);
  -ms-transform: scaley(1.72);
  -moz-transform: scaley(1.72);
  transform: scaley(1.72);
}
<div id="video">
  <video id="Video1" width="100%" height="100%" loop>
    <source src="video/League-warrios.mp4" type="video/mp4" />
  </video>
</div>

As you can see here in this code snippet it is 100% tall and wide, but it is only the height because I have been adjusting in CSS in tag transform:scale(1.72); however this method is wrong it would have to adjust automatically because if it is placed on a very small screen it will not fit correctly

This is the print of the way it is working but not the correct way to do it:

    
asked by anonymous 29.05.2015 / 20:46

1 answer

2
#bgvid {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translateX(-50%) translateY(-50%);
}

<body>
   <!-- Todos os outros elementos devem ficar aqui para não sobrepor -->
   <video muted autoplay loop id="bgvid">
      <source src="video/League-warrios.mp4" type="video/mp4" />
   </video>
</body>
    
29.05.2015 / 21:58
How to display an alert and clear fields with classic asp? Configure routes using ASP.NET MVC 5 areas