Full screen video!

HTML-CSS
1

Tell us what’s happening:
I want this video correspend the screen ,like a full screen video. When I set up only the width ,it would be too big. If I set up both height and width, the height is fit, but the width would not meet the screen.
Please tell me how to change the CSS!!
Thank you!!

Your code so far

<head>
<style>
#wrapper{
  min-height: 100%;  
}
.img01 {
position: relative;
top: 10%;
left: 0%;
bottom:0%;
width: 100vw;
height: 100vh;
object-fit: fill;
z-index: 1;
background-color:white;

}
.img4{
width: 100vw;
height: 100vh;

}
</style>
</head>
<body>
<div id="wrapper">
<div class="img01" >
<video autoplay loop class="img4">
  <source src="https://2019.igem.org/wiki/images/f/f5/T--CCU_Taiwan--home1.mp4" type="video/mp4">
</video>
</div>
</div>
</body>
```</html>
2

Maybe try this?

.img01 {position: fixed; right: 0; bottom: 0; min-width: 100%; min-height: 100%; object-fit: fill; z-index: 1; background-color:white; }

Hope this helped!

3

Thank you for responsing me. But when I use this, the top of this image will be cut.:’(