How to crop an video in a section and be responsive

Hi guys !

I’ve been stuck for hours on this problem: I’ve tried many ways, I can’t get my video into the section. Can you help me?

thanks for your help !


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hi Mathieu!

Can you please share your read-only link here? It will be easier to deduce by looking at your site in the Designer :slight_smile:

My first thought goes to adding overflow: hidden to your section.

https://preview.webflow.com/preview/trygr?utm_medium=preview_link&utm_source=designer&utm_content=trygr&preview=786de0229a92180117ae650cd8aa67ac&workflow=preview

Thank you for helping me!

So @Stacy i have this prolem, like my video is in the section with your tips, but my video is crop. how can i recenter that video ? and how can i rounded edges ?

Update @Stacy ? i dont solve my problem

to be more precise, I can’t edit the different position parameters on the video. so I can’t place it in the mother div.

Hi @MathieuTrygr, Dozie from Memberstack here

Saw your question hadn’t been fully responded to and wanted to share info I think might help :hugs:.

1 - To use the position parameters, try making sure your video is absolutely positioned within a div that is relatively positioned.

Div

Video

When you get it right you’ll see the absolutely positioned video element will say what it’s positioned relative to.

image

2 - But that may not fix your problem of a video overflow. I suggest having a look at this conversation where they had a similar issue

To properly set a custom width and height for a video element, you need to place it in a div, and set the width and height of that parent div in pixels. I suggest avoid using percentages.

Step 1

Add Div

Step 2

Set custom width and height

image

Step 3

Place a video element. The video element will take up the full width of the custom div, but you might need to change the size of the custom div for each device size.

You can see full details in this Webflow article

3 Likes

Thanks @Dozie ! that was so helpfull ! Appreciate

2 Likes