100vh hero section on mobile view

[Yuli_H (Yu)]

Hi,
When I set the hero section to be 100vh, everything works as I desired except for the mobile view. (Some contents exceed the section, and in mobile view, it doesn’t take 100vh.)

Does anyone know how to fix this? I appreciate for the answers!

Here is the read-only link:
https://preview.webflow.com/preview/yulis-portfolio?utm_medium=preview_link&utm_source=designer&utm_content=yulis-portfolio&preview=dfcbe0e13c4b2bce120ee21538f1979a&pageId=5e26869a16b6d1cc4afbbb56&mode=preview

Here is what I am referring to:

[Nicole_Klaver]

Hello

Not sure if you’ve already made changes, but from my side it already looked better with less overlapping. I had a look at the link and on mobile I gave the ‘Container’ within the ‘Hero Section’ min h: auto and then gave the ‘Intro Block’ margin-bottom: 60px. It seemed to work.

Please let me know if this helped, otherwise I will find another way

[Yuli_H (Yu)]

Hi,
Thanks for contributing. I have followed but it doesnt work.

[ElviraNL (Elvira Clement)]

Does this work?

[Yuli_H (Yu)]

No… I tried as the photo shows.

[ElviraNL (Elvira Clement)]

That screenshot is it from the designer? Or on your own mobile?

What browser are you working in?

[Yuli_H (Yu)]

it is from designer. I am working on Chrome. I tried to refresh but it does not look like it in your pic

[ElviraNL (Elvira Clement)]

Have you updated your chrome? What version are you using? (You can find this at the three dots at the right corner of your browser, than go to Help → about chrome, I have chrome in my )

Some more question:

• What is your screen resolution?
• Are you on windows or mac?

[Yuli_H (Yu)]

Hi,
I just update, still not working…
I am using mac. I adjusted screen resolutions and the overlapping area gets smaller in high resolution (but still overlapping…)

[Yuli_H (Yu)]

It fixed! I set min h to be 100% then everything works. Even though I don’t know why…

Thanks for helping!