Mobile horizontal 100 vh extende page

Ask the community
1

Hello,

When setting a single section to 100 vh and then opening it on a mobile phone in horizontal position, the page gets extendend somehow.

1334×750 7.55 KB

The picture above the a screenshot of an example. The light color is the section with height set to 100vh. The darker color is the page background.

I’ve also created an example site in case anyone wants to test it: https://ietzenboorsma.editorx.io/test

Kind regards,

Ietzen

2

The Editor X bar on top is probably the issue. This bar is not accounted for in the Editor X modelling. With a paid subscription this issue does not exist…You could also try to use a grid with a calculated height of 100vh minus X pixels.

3

Hey @ietzenboorsma ,
Im Jonathan from the Editor X team.
It seems that your image is set to 100vh, but your section has a min-height of 500px. Therefore, once your screen is smaller than 500px the image will adjust itself to fit the screen’s height, but the section will stay 500px.

4

Hi Jeroen,

Thank you for you answer. I know of the Editor X bar which I think the framework should account for. However, the problem I describing is also occurring on the paid version.

5

Hi Jonathan,

I indeed had that problem before so I though I’d just forgotten to set is correctly. But I doubled checked and I had the section height set to “100vh”
with minimum tot “None”. The image is set to stretch the section.

257×1215 14.6 KB