How can I create a responsive fullscreen section like hero section for example?

Question

I'm trying to build a fullscreen section that takes the whole screen but can't find a way to do this.

Sebi Vidret, Product Manager · Accepted Answer

Hi @mourchid ali

Great question! You can create a full screen section by setting the section height to 100VH.

Note:

VH = Viewport Height

1VH = 1% of the Viewport Height

100VH = 100% of Viewport Height

Please share with us your results, we would love to see the hero image.

mourchid ali · Answer

You're awesome :) It works. Here's a demo result https://alimourchid.editorx.io/xsite

mourchid ali · Answer

I have one more little issue. the image background is downloadable! I don't the save image option to appear when you right click. just like the way we have on wix regular editor strip background. is there a way I can do this ?

Ricardo Herrera · Answer

@mourchid ali you can simply put a fully-transparent rectangular shape from the add pannel (+) on top of the background image and with its same size and margins, that way it prevents to be directly clickable and, hence, not downloadable by the average visitor ;v #workaround #cleverhuh

mourchid ali · Answer

Which problem you're having exactly? the full-screen section or background image downloading ?

Community X.

Editor X

How can I create a responsive fullscreen section like hero section for example?