We’ve been using PhoneGap a lot for our recent projects to help quickly develop simple mobile apps for clients. With the release of iOS 7, all apps are now running in ‘full screen’ mode, which creates an issue with your viewable content as none of our apps were compensating for the top status bar (and thus, overlaying headers, navigation, etc).

The easiest way to handle this is discussed here, but if you’re using jQuery Mobile in tandem with PhoneGap/Cordova, you’ll need to make sure you’re adjusting the ui element as such:

.ui-page { margin-top: 20px; }

We then can wrap a style inject or class add into our document load so we only apply this override for iOS 7.

You also could compensate for the full-screen mode in your app layout, but as a stop-gap this should work fine.