Video Fill the Container

Site URL: https://www.aetna.club/

Hi there.

Hi everyone,

I'm facing an issue with getting videos on my Squarespace site to properly fill their assigned blocks while maintaining their original aspect ratio. I want the videos to upscale and fill the block entirely, even if it means cropping parts of the video, similar to how object-fit: cover; works. Additionally, I’d like this to work for all videos site-wide, so I don't have to apply custom solutions to each individual block.

On top of this, I’d love for the videos to behave like images do on hover—for example, showing a subtle zoom or fade effect. Right now, when I try custom CSS, either the video disappears entirely, doesn’t scale properly, or doesn’t center in the block.

Here’s what I’ve tried so far:

Using object-fit: cover; in combination with width: 100%; and height: 100%;.

Wrapping the video in a container with overflow: hidden; and aligning it with position: absolute;.

Ensuring that the parent blocks have defined heights, but videos still disappear or misalign.

I need this solution to work across the entire site for native Squarespace video blocks and embedded videos (e.g., YouTube, Vimeo). If anyone has encountered and solved this issue—or can point me in the right direction—it would be a massive help!

Thank you in advance! 😊

Can you share link to a page where you use video?