window elements become invisible vertically while moving from portrait to landscape and back to portrait in mobile screen?

Question

In a mobile application, I have a div on a page. Within this div(data-role="page"), I have another div(data-role="content"). Now in this div I have an iframe and my menu page opens in this iframe. The problem is when I open the app in landscape and changed the orientation to portrait, half of my menu cut down vertically. Pls help what I m missing??

Thanks,

Answer 1

Is this on IOS?

If so, this is an apple bug. The fix can be found here;

https://github.com/RatioInteractive/HTML5-Mobile-Boilerplate/blob/master/js/helper.js

also, take a look in the index.html for stuff like this;

  <!-- Mobile viewport optimization h5bp.com/ad -->
  <meta name="HandheldFriendly" content="True">
  <meta name="MobileOptimized" content="320">
  <meta name="viewport" content="width=device-width">
  <!-- ========== -->