Video Background - Locked to Section Height

Site URL: https://esportsengine.gg/

Hi all! First time posting - I've tried to look up the answer on this, but haven't had any luck, so please let me know if this can be found elsewhere.

Anyways, I was wondering if I can replicate the look/design by using Squarespace found on this website: https://esportsengine.gg/

Specifically I'm looking at the 1st section (after the top banner) that has a red tinted video on the left with the words "WE WIN WHEN YOU WIN" on the right. It appears that the left side is a video and the right is a text block. But, when scaling the browser size, the video maintains it's aspect ratio and stays locked to the bottom and top of the section. Additionally, the words don't cross over onto the video, but instead maintain their positioning on white. On mobile the words appear beneath the video.

Is is something that is possible utilizing Squarespace? Any and all help is appreciated -- total coding newbie, so go easy on me, thank you!

1 hour ago, TheDaTNetwork said:

Site URL: https://esportsengine.gg/

Hi all! First time posting - I've tried to look up the answer on this, but haven't had any luck, so please let me know if this can be found elsewhere.

Anyways, I was wondering if I can replicate the look/design by using Squarespace found on this website: https://esportsengine.gg/

Specifically I'm looking at the 1st section (after the top banner) that has a red tinted video on the left with the words "WE WIN WHEN YOU WIN" on the right. It appears that the left side is a video and the right is a text block. But, when scaling the browser size, the video maintains it's aspect ratio and stays locked to the bottom and top of the section. Additionally, the words don't cross over onto the video, but instead maintain their positioning on white. On mobile the words appear beneath the video.

Is is something that is possible utilizing Squarespace? Any and all help is appreciated -- total coding newbie, so go easy on me, thank you!

You can add video background to section and use css to make the effect available since section-background and section-content are 2 seperate divs

@bangank36 thanks so much for your reply. Unfortunately, as I'm very new to coding, I'm not sure how to do what you described. Is there any chance you could elaborate on how to accomplish that? Or, somewhere you can point me towards more answers? Thank you again!

On 7/22/2021 at 1:17 AM, TheDaTNetwork said:

@bangank36 thanks so much for your reply. Unfortunately, as I'm very new to coding, I'm not sure how to do what you described. Is there any chance you could elaborate on how to accomplish that? Or, somewhere you can point me towards more answers? Thank you again!

Hi. Have you solved it yet?

Also do you need to fix these?

Site URL: https://esportsengine.gg/

1. (Tablet – Services) Number is cut off

https://esportsengine.gg/services

2. (Mobile – Services) The same here

https://esportsengine.gg/services