Html5 tag Video does not work on Chrome

Question

the tag is working fine on firefox and IE Explorer, however does not work on Chrome. I have two video formats, mp4 and webm.,

Here is the html

<video playsinline autoplay muted loop poster="8.jpg" id="bgvid">

    <source src="8.mp4" type="video/mp4">
    <source src="8.webm" type="video/webm">

</video>

And my css

video#bgvid { 
position: fixed;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
-ms-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background: url(8.jpg) no-repeat;
background-size: cover; 
}

If you want to see a live version, you can find it here.

https://neevasoft.com/icedrink2/

Thanks in advance for the help

Answer 1

Your source file links aren't working. If you're using the above url for your src attribute you need to put the videos at the same level of your index.html file and there isn't any videos at this level in your file structure. Alternatively place them in one of the folders and change the src url accordingly.