iOS 7 iPad Safari Landscape innerHeight/outerHeight layout issue

Question

We\'re seeing issues with a web app that has a height of 100% on Safari in iOS 7. It appears that the window.innerHeight (672px) doesn\'t match window.outerHeight (692px), b

Answer 1

Samuel's answer, as also stated by Terry Thorsen, is working great, but fails in case the webpage has been added to the iOS home.

A more intuitive fix would be to check for window.navigator.standalone var.

if (navigator.userAgent.match(/iPad;.*CPU.*OS 7_\d/i) && !window.navigator.standalone) {
    $('html').addClass('ipad ios7');
}

This way it only applies when opened inside Safari, and not if launched from home.