NO BUG: Website not optimized for landscape mode on iPhone

Hi all,

I am trying to adjust my layout for different breakpoints on mobile devices and came across the issue for LANDSCAPE mode for mobile as it doesn’t fully stretch as shown attached. (The landscape screen size is recommended and according to the device landscape size, so I am wondering what is wrong).

I have tried to search for some solutions but to no avail. Could someone help me on this? Thank you.

Hi Steffie,
Welcome to the forum, and thanks so much for your report!

However, this is not a bug. It’s because of the notch of the iPhone, see:

On bricksbuilder.io we use this:

Bricks » Settings » Header scripts:

<meta name="viewport" content="initial-scale=1, viewport-fit=cover" />

Bricks » Settings » Custom CSS:

.brxe-container {
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

Best regards,
timmse

Hi Timmse,

Thanks a lot for your explanation. Let me try to see if it works.

Regards,
Steffie