Hello, Thank you for your response. Actually, this was my first attempt at building this out but I soon realized the background video is not responsive which causes issues. This is why I tried to make the video element in the back of the other elements however the z-index is not working.
Hi @Jennine,
The video background is responsive, but it only works with the self-hosted videos. I would suggest you go through the following thread on a similar topic.
Alternatively, you can try Slider Revolution which will allow you to achieve what you are trying to achieve. I would suggest you go through the following article on this.
Thanks
This is a self-hosted video
Hello Jennine,
You can use a DIV element below the Video element. You position it as “Absolute” like this:
You will also have to enable the Flexbox option of the DIV element so that the headlines will be at the middle.
Best Regards.
Hello, Thanks for your response. I implemented your suggestions however it is underneath the video now. Please advise. Thank you
Hello Jennine,
To help you with your concerns we need to check your setting, I would request please share the admin login details meanwhile I would suggest you troubleshoot a few of the common issues before we investigate your settings. Please share your details in a secure note. Please provide the following details
- WordPress Login URL
- Admin-level username and password
- Exact page URL
You can find the Secure Note button at the bottom of your posts
Thanks
sure I will attach them thank you
Hey @Jennine,
On which page did you implement my suggestion? Can you please share the URL of the page to us?
Thank you.
yes it is thank you
Hello @Jennine,
The Flexbox option for both of the DIV elements must be enabled and aligned to the center.
Best Regards.
great thank you so much!
Hi Jennine,
You are most welcome.
Is there a way to ensure that the content within the div is responsive? It appears disorganized on iPad and mobile devices. please see the attached screenshots.
thank you!
Hello @Jennine,
You will have to set the maximum width of the image for smaller screens to at least 300px:
The DIV element’s Flexbox Wrap must be set it Off:
Best Regards.
Thank you. Can you please tell me how to get the video vertical height like this on mobile?
https://johnwick.movie/
Right now my video looks like this:
https://warriorsofstone.com/
Please advise
Thank you
Hello @Jennine,
It will not work for your homepage because the created demo is using a different element structure setup. You can copy the demo instead.
Best Regards.
