HELP! Video not fitting screen!

Hey guys

Of course Webflow has not integrated CMS background videos so i am stuck attempting to create this on my own.

So far the image below is what I have but there are bars on either side of the video.

Why is this happening? Why can i not just make a video fit the screen? Please someone help!


Here is my site Read-Only: https://preview.webflow.com/preview/classicperspective?utm_medium=preview_link&utm_source=designer&utm_content=classicperspective&preview=5a626268e960effb152a53908770cb83&pageId=5d5531afdd4be97b9075ee9e&itemId=5d5531afdd4be9a36675f971&mode=preview

Why can’t you use regular video element for that?

Can you use that for a auto play heading?

Ah… no you cannot. Embed is more flexible in that regards. Anyway, have you tried to make your embed responsive when copying the code from vimeo?

This is the code I have used. How would I make it responsive?

<iframe src="https://player.vimeo.com/video/357879285? <p>background=1&muted=1&autoplay=1muted=1&loop=1&autopause=0" width=“100%” height=“100%” frameborder=“responsive” allow=“autoplay; fullscreen” allowfullscreen></iframe></p>

Try getting the embed code right from the vimeo page. There will be an option to make it responsive when you are creating your embed

@Grant1 - Try to refrain from opening multiple topics for the same thing. It is not helpful.

Look at this pen for the answer → https://codepen.io/wfhow/pen/0bab54c27e46cfc7875909b7d9fd2958

I have attempted getting the new code from Vimeo with the paid account but this is even worse.

I have now lost autoplay, a logo for full screen has appeared, there is sound and no auto play on the video.

Add ?background=1 right after the video id

Here is a simple project using Vimeo video as a background element.

https://preview.webflow.com/preview/vimeo-bg?utm_medium=preview_link&utm_source=designer&utm_content=vimeo-bg&preview=c8cfb8a73d6b7dcf5d0c00858789d803&mode=preview

Published view : https://vimeo-bg.webflow.io/

Thanks so much for this! I need BG as cms… but somehow I dont know how to make it that it covers the div. The normal static bg works well, but not the vimeo embeded one. Do you know why?

Here is the link. There are 2 columns. the left is the vimeo embeded one. I want that it’s centered and covering the div all the time. What am I missing? Its keeping radius when I smallen the screen and white borders are shown.

https://wtp2020.webflow.io/completebikes/envy

https://preview.webflow.com/preview/wtp2020?utm_medium=preview_link&utm_source=designer&utm_content=wtp2020&preview=a969265e02625dade58b5c4a09799fb3&pageId=5e1cbed2da2c73beabac80ea&itemId=5e1cbf018fdd2eb66232ff6e&mode=preview

Thank you