Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cordova navbar bigger in iOS 6

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.

iOS 6 vs iOS 7 navbar

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.

like image 329
Mr.P Avatar asked Apr 21 '15 08:04

Mr.P


Video Answer


1 Answers

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/

like image 53
becoop Avatar answered Oct 18 '22 21:10

becoop