Streaming live at 10am (PST)

Background Video Error


#1

I've added a background video to my hero section and it displays properly in the designer and in preview mode. However, when the site is published the background video is only displayed at roughly 50% width and 50% height, and is showing up in the bottom right corner of the hero section. My preview and published links are both below. Thanks in advance to anyone who can provide some insight!

Preview Link
Published Link

Anyone who can provide any insight on this? @sabanna @VladimirVitaliyevich @Waldo @vincent @PixelGeek


#2

Hi @jordanshotwell

Don't treat your background video element as its own element. Treat it as a div with a video background. This means you can put elements inside of it and not set it as a position:absolute;

try this and let me know how it goes


#3

Thanks @PixelGeek, didn't realize it could be styled like a div!

I found the culprit, it was actually a bit of custom code I had inserted on a previous build to create background video, before Webflow implemented the actual background video element. Thanks for your help all the same!

if (w > width) x = -(w - width) * 0.5;
if (h > height) y = -(h - height) * 0.5;

#4

i would suggest not using code and just using the background video element as a regular div. It'll make things easier IMO.

but glad you found the solution :slight_smile:


#5

For sure. I eliminated the code, it was from a previous build and was interfering with the new element. Thanks again!


#6

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