IOS statusbar padding


Hey folks,

I tried really everything, but I’m not able to get rid of the statusbar on my IOS device.

I tried the following things:

statusbarPadding: false

$cordova-ios-statusbar-padding: 0px;

.ios ion-nav > .ion-page > ion-content.statusbar-padding:first-child .scroll-content{
   padding-top: 0px !important;

and of course… with true/false…

platform.ready().then(() => {

…but nothing seems to work. Attached a picture of the behaviour from Ionic View.

Does anyone have a solution?



Wow i’m testing on IOS (android is fine) and got a very similar problem!


When I have seen this, there is usually incorrect ionic tags used in the header or some custom CSS that is having unintended consequences.


So far i’ve understood that overlaywebview must be true for IOS otherwise Ionic goes buggy/crazy.

If you want to try, but i gaved up because the google map plugin will be displaced by 20px vertically you have to:

  1. set statusBar.overlaysWebView(false)
  2. into the App’s config module add the config’s option: statusbarPadding:false

But as i said i think this will introduce a 20px white padding in your footer, at least with google’s map plugin :frowning: