0

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>
Bryan Orellana
  • 21
  • 2
  • why use an ` – tacoshy Jan 18 '21 at 00:21
  • 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? https://codepen.io/cdsnl/pen/GRjzqVE. So the problem is something else. – Kudos Jan 18 '21 at 01:11
  • 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. – Tim Vermaelen Jan 18 '21 at 09:29
  • I was able to fix it by doing a bit more research and took me more time than I expected. I used – Bryan Orellana Jan 20 '21 at 04:03
  • Does this answer your question? [Bootstrap 3 - Responsive mp4-video](https://stackoverflow.com/questions/26040136/bootstrap-3-responsive-mp4-video) – CodeMonkey Jan 20 '21 at 04:13

1 Answers1

0

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.

Bryan Orellana
  • 21
  • 2