Can I prevent device rotation so my Bubble app is portrait only

For mobile. I like to lock in portrait only even if they attempt to rotate their phone or iPad.

1 Like

For sure that is possible, just build the page to be portrait size and make it fixed width.

You might be able to do this if you are looking to create a native app like this post discusses: Phone Rotation Lock

In the browser, maybe try something like this: https://css-tricks.com/snippets/css/orientation-lock/ or you can try something like this: https://developer.mozilla.org/en-US/docs/Web/API/Screen/lockOrientation just change it to portrait instead of landscape maybe. :man_shrugging:

Hope that helps! :blush:

@j805 www.NoCodeMinute.com

For All Your No-Code Education Needs:

  • One-on-One Tutoring
  • eLearning Hub
  • Video Tutorials
  • No-Code Classes
1 Like

Thanks! Dumb question, but how and where do I apply the style?

Ie I know I want style="height: 100vw; transform: rotate(90deg);" but where do I put it? I tried adding that to an HTML element on my page but Bubble didn’t like it.

Thanks. But how does that work for viewports from the smallest phone up to say 800px or more for tablets?

It wouldn’t work

If you wrap your app with Nativator.io you will be able to choose between: Portrait, paysage or auto mode for both Android and iOS.

Cheers,
Sam