Streaming live at 10am (PST)

Video Background Element - Not responsive


#1

Hello,

I have put a video background element on my home header website. (http://studiomegalo.webflow.io/)

On webflow backoffice, the “responsive” video background is working for tablet and phone.

But when I am testing it on 2 ipads (one big and one small), the video is making my page huge. Screenshot here :

Do I need to put some specific sizes for this video background ?
I tried 100% width and 100% height, didn’t work. I tried 100vh height, didn’t work either.

Thank you in advance,
Regards,

Eva


#2

Yeah, I keep saying all the time - GET OFF APPLE & COME TO UTOPIA SAMSUNG :grin: Man I can’t stand apple… anyhow.

Try adding “VW” to the width of the video wrapper, not the video div itself. 100, 75vw


#4

thank you for your answer.

I tried to put 100vw and 75vw but it didn’t work.
I tried also to add a section and put the background video element in it, but nothing changed ^^.


#5

Now there’s is a way to work-around this. It will take a few steps but if you want it, ill write out the steps for you.


#6

Well yes, if you have an idea of how to surround this problem, I will be very happy to have your help :wink: !


#7

Here is my website : Preview Mode

Did I made something wrong with the video background element ?
@Waldo, I would be really happy if you could help me :blush:


#8

@evamelba great question!

Settings your video background element back to relative position and overflow: hidden should resolve the issue which you’re encountering as shown in this GIF: https://cl.ly/1e0q1Y0c2u1V


#9

Wow thank you so much !!! It is working. :tada::grin:
I am so happy, I passed several hours on this issue !


#10

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.