Div with 100% height without scroll bar

If an overflow occurs it is because there is a border or padding that causes it to occupy beyond its dimensions. Remember that every item has 4 boxes: margin box, border box, filler box and content box. These four boxes make up the dimensions of every element.

The video tag is a inline element and, as is known, these elements add a kind of white space around them, causing their initial dimensions to be affected.

The solution (there are several) is simple: make the video a block element:

/*
 * Reseteado CSS básico. Todo navegador
 * agrega por defecto estilos a las etiquetas,
 * por lo que es conveniente "normalizarlas".
 * Además, es recomendado usar el modelo de
 * caja border-box en lugar de content-box.
 */
html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
  margin: 0;
  padding: 0;
}

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

.video video {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

<section class="video">
  <video controls autoplay>
    <source src="https://dl.dropboxusercontent.com/s/odxyj57wwvz0mib/deadpool2-trailer.mp4?dl=0" type="video/mp4"/>
  </video>
</section>

I've used object-fit which causes certain tags like video to throw out the default aspect ratio and adapt to the dimensions. If you want to make a full fullscreen, you can use the Fullscreen API that has a lot of support decent. On the other hand, the support for object-fit is also good, except for IE and Edge (I guess the latter will implement it) soon).

To avoid scrolling, use the CSS overflow option, use overflow: hidden; and the bar will not go out, but if the content is greater it will be cut.
If using 100% height is passed a little, it may be because there is a padding or edge, try to remove it with padding: 0px; and border-width: 0px; It could also happen that the parent object has some margin, if it is the case it calculates the size of the div with respect to the parent or uses a margin: 0px;

To remove the vertical scroll put this code in your file style.css You will not need JavaScript. Try it:

html,body{
    overflow-x: hidden; 
    color:black; 
    font-family:'Opens Sans',helvetica;
    height:100%; 
    width:101%; 
    margin: 0px; 
    padding: 0px; 
}