Solution 1 :

Can’t believe I’m doing this but I was able to fix my own question

         <video  controls>
            <source src="image3/video.mov" type="video/mp4">
            <source src="image3/video.mov" type="video/ogg">
          </video>

And since I was using bootstrap and put it in a container I had to remove the padding from the container to make it display properly on mobile.

Problem :

The issue I’m having is making my video responsive in bootstrap. Also, when I ran this code on my laptop, for some reason it downloads the video instead of showing it. Therefore, this code doesn’t show the video or makes it responsive. This is the code I have:

<div class="container">
   <div class="embed-responsive embed-responsive-16by9">
    <iframe class="embed-responsive-item" src="image3/video.mov"></iframe>
   </div>

Comments

Comment posted by tacoshy

why use an

Comment posted by codepen.io/cdsnl/pen/GRjzqVE

There is nothing wrong with the code? Can you show us what you are seeing? I copy pasted it in codepen and it works fine?

Comment posted by Tim Vermaelen

Are you perhaps running your website as a file or through a localhost server setup? Also *.mov is quicktime and I believe it’s outdated or you’re missing the MIME type setup.

Comment posted by Bryan Orellana

I was able to fix it by doing a bit more research and took me more time than I expected. I used

Comment posted by Bootstrap 3 – Responsive mp4-video

Does this answer your question?

By