Problems with my background video layout

[Jose_Urbano]

Hi guys, new to Webflow and I’m excited to learn more from this amazing platform! I unfortunately have some trouble with layouts on an example website I’m building.

In the website, the hero section is separated into two columns via grid - the left side being a div block with a background image and the right side being a container with a background video and some text. The background video’s positioning is relative to itself (i still don’t really understand what it means, but doing this helps me achieve the effect that i want)

The problem is this - when I toggle on preview and view the website at 1900px (100% on my screen), there is some white space inbetween the two sides, even after I’ve removed all form of padding/margins from respective elements.

Here’s what I want it to look like:

Here’s what it looks like now:

Would anyone be able to help out and give some advice? Thank you very much!

Here is my site Read-Only: https://preview.webflow.com/preview/don-campbell-website?utm_medium=preview_link&utm_source=designer&utm_content=don-campbell-website&preview=b5e13ae1045ce1b02d5e7af0d4ed406c&mode=preview

[bro-design (Dmitrii Tregubov)]

Hi, @Jose_Urbano. The problem with white space in that for right column you choose “Container” element which has a fixed width.

Just replace it to usual Div Block and all should works.

Also I saw that your project has a horizontal scroll on small displays like as on notebook. This thing came about because you set a “fixed” font size in PX. It is logical that a large font does not fit in a small screen size. For solve this problem — on Desktop version just set font size and line height in VW.

Good luck