Cordova navbar bigger in iOS 6

Question

Working with Cordova and Ionic at the moment and trying to make an app as backwards compatible as possible (which is going surprisingly well) except I have stumbled upon one small issue.

The navbar after iOS 7 is bigger in that it covers the background of the status bar as well, as seen below.

So when I load the app on a phone running iOS 6 or earlier, the status bar doesn't get resized, the whole page just gets moved down, hiding some of the content in the footer.

Any help would be greatly appreciated. I'm probably missing something simple.

Answer 1

If I'm understanding correctly, then you need to add padding like this:

document.body.style.marginTop = "20px";

This should make the navbar view correctly.

See this - http://coenraets.org/blog/2013/09/phonegap-and-cordova-with-ios-7/