Fullscreen background image?

how can I set the hero section (main section on top of the page) to fill the screen (from top to bottom) on all brovser dimensions?

Set it to height:100%, but it will work only if you ALSO set the height:100% on the <body> element (:

1 Like

Try also to set it up (height) as 100VH. That will fill up the entire current viewport (screen size).

Hi what would be the difference with VH and % in that case?

Technically, I’m not so sure myself. But if I put a section/divblock as 100% instead of 100VH, it will not fill the entire page. Plus, correct me if I’m wrong, 100VH will calculate itself every time the screen were re-sized.

That is what I thought was the main difference. the other, I thought, was you wouldn’t need to set the body to 100%height because vh explicitely targets the browser height. But none of these two are right in Webflow. A 100% height section will recalculate after every resize of the browser, and 100vh won’t work without the body set at 100%.

I’m a vh noob.

1 Like

What is th vh and to set it? (new to webflow and web desing altogether )