Why isn't my Shopify video displaying correctly on mobile?

JCRocket
Visitor
2 0 0

Hi Everybody,

I am having issues with the video displaying on mobile. Its currently stuck in desktop view sizing when shown on mobile. Is there anyone who can help? Below is the code I'm using for the custom HTML modular on themes. 

<video class="video-background" loop="" muted="" no-controls="" autoplay="" src="any link" playsinline="" iframe="" width="1340" height="" frameborder=" 0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="">
  <source type=" any link">

</video>

 

Replies 3 (3)

Ninthony
Shopify Partner
2329 350 1023

If you can post a url we can probably give you a css solution. I'm assuming you want it to be larger but cropped on both sides?

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄
JCRocket
Visitor
2 0 0

Hi Ninthony, 

I was able to fix the issue using a different sizing solution. 

style="max-width: 100%; height: auto
 
shop.kingston.com. Now, its resizing the embedded video to fit perfect on mobile.
Ninthony
Shopify Partner
2329 350 1023

Glad you got it figured out.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄