How can I fix the video background scaling issue for mobile on my custom liquid?

[ZayMadeThis]

I have a problem with my custom liquid im trying to make a video background for this webstore and im having trouble with making it work on mobile phones it scales perfect for desktops...

Site(https://rpghd7301gqcman5-71902593314.shopifypreview.com)

!CODE BELOW!

<style>

video {
display: block;
margin: 0 auto;
width: 100%;
height: 100%;

}
<video autoplay loop playsinline muted>
<source src="MYFILELINK">
</video>

[Typostore]

Hello,

if you want make auto play on mobile I think you need custom more code jquery for it

function this can make auto play on mobile and desktop, and use some css to fix bug on desktop ver.

You can hire a shopify expert who will surely help you.

You can connect with us, too. We would love to help you out.

thank you

[GemPages · Accepted solution]

Hello @ZayMadeThis 

I would like to give you the recommendation to support you.

You can try the below code so the video will show full width and autoplay on the mobile:

<video loop="" muted="" playsinline="" autoplay="" src="https://cdn.shopify.com/s/files/1/0349/7472/8236/files/vitakey-gif_3.mp4?v=1591688508" width="100%" height="100%"></video>

I hope the above is useful to you.
Best regards,
GemPages Support Team

[ZayMadeThis]

yeah no that didnt work here is the actual problem im having