Why is my video slider appearing funky in the live site?

Can someone please help us figure out why our video slider is overflowing in the published view? In the designer as well as the live preview, everything looks and works fine.

Thanks!

I----------
https://preview.webflow.com/preview/all-access-equipment?utm_medium=preview_link&utm_source=dashboard&utm_content=all-access-equipment&preview=c16fe0820d30a766692593085ebb3107&workflow=preview

I can see that WF is still using padding-top: 56.25% trick (called in WF “magic”) while there is a modern way using “aspect-ratio”. When I have removed from DOM this awkward number. video sits back to its position.

Try to use embed and use aspect-ratio that is 16/9. %

NOTE: check in browser your errors you should fix

Thank you for your reply and help. I am having trouble understanding your suggestions. Are you saying to remove the padding? If so, on which element?

Or are you suggesting to use the embed element? If so, I’m not sure how to put the video into that and make it 16/9 %.

Thanks again!

hi @Michael_Censullo you can’t remove this pre-backed padding in video element.

I really do not know why this happened and didn’t have time to investigate further on some of mine test project to see if I will have identical experience.

My recommendation is to avoid any of WF pre-backed elements. In you case use embed element and use YT exported iframe to start with.