▼
Streaming live at 10am (PST)

Video not resizing properly on mobile

#1

Hi,

I’m having issues with my Main Background Video divs not resizing properly on mobile on my published site (on my ‘Pilot Twitter’ and ‘Pilot Iconography’ pages. The divs are resizing properly in the builder preview but not on my published site.

On builder:

Capture
Capture.jpg1920x883 200 KB

On published site:

Capture2
Capture2.PNG491x969 88.9 KB

Read-only link: https://preview.webflow.com/preview/joycxu?preview=6a48f5cbf0887eec28c538693328330f

Published link: http://joycxu.webflow.io

Thanks!

#2

I suggest using “VW” for width, and “VH” for height. Percentages work, but sometimes it’s specific enough for me. When you want to get granular and picky - like I am - haha… Use the VW, VH. These styles cascade better too. On the next device, you only need a little tweaking. :grin:

#3

Ahh. I’m not too familiar with how VW and VH work, I’m testing it out and still getting some weird behavior. Do you have any suggestions? Thanks!

#4

Sure, but on the video, I see is the background is independent from the monitor video, right?

  1. Because that’s causing the problem of not scaling both at the same time. How was that done? Can you combine them both as a video? Without separating the background from the actual monitor, make them all one export file.

  1. You must type the letters in after the number. VW = Viewport Width, VH = Viewport Height. These, at least in my opinion, offer better scaling than percentages.

  2. As you can see, the monitor scales at a different rate than the background. If you can re-create the video, but add the background in the video editing file before export, they will scale equally. :grin:

Let me know how that works.

#5

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