How to make a section responsive to viewport height

Hi Webflow experts! I’m designing a re-build of Starlink’s homepage.

My question in particular is how to make a section responsive to viewport height.

In this case,

I have set a fixed gap of 400px between the top & bottom HeroContent. but when the viewport height decreases the content is pushed out.

like this,

Please explain how this works, so I can improve my future designs as well.

Thank you in advance.


Here is my site Read-Only Link:

https://preview.webflow.com/preview/starlink-home-rebuild?utm_medium=preview_link&utm_source=dashboard&utm_content=starlink-home-rebuild&preview=3c59a5b87d2ef4efaadf345afcd42fa9&workflow=preview

Hey Harik,

did you try vh values for height? 100 vh should always be the full current view port height.

Best,
Nik

Hey @nik_meixner, Thanks for trying to help.

I have fixed the issue.