Video background text not shown on mobile version

[Emmacharle]

Hi everyone,

I added code for a video background (https://youtu.be/-Zy-gHGQDtU?si=TfnAWuTN0EJWuRDC) to my website. Unfortunately the text overlay on the mobile version has disappeared and I am unsure as to why. I have tried lots of different fixes but cannot seem to figure it out! 

I used the code on dawn theme. Any advice and fixes would be greatly appreciated!  

Thank you! 

Emma 

[PageFly-Theodor]

Hi @Emmacharle ,
This is Theodore from PageFly - Shopify Page Builder App.

Emma's text overlay on mobile video background is missing! Here's how to fix it:

Possible Causes:

• Missing mobile styling (media queries).
• Conflicting mobile styles.
• Low z-index value hiding the text.

Fixes (using Shopify theme editor):

1. Media Queries: Add media queries to adjust text styles for mobile screens.
2. Check Conflicting Styles: Ensure no mobile styles unintentionally hide the text.
3. Adjust Z-Index: Increase the z-index value of the text overlay element.

Best regards,
Theodore | PageFly

[Emmacharle]

Hi Theodor,

thank you for your response. Unfortunately I am not well versed in website development and I am uncertain on how to go about the solutions you proposed, would you mind providing me with more guidance? 

many thanks,

Emma