Status bar background


I’m having some problems with the status bar on the app I’m building, its pushing the header down and the status bar has a white background. I basically want it like this but with white text Messenger App (XMPP + Ionic framework).

When I view it in the iOS Simulator it works fine but when i uploaded to to PhoneGap and install it on my 5s it got a white background and the header is bigger because its being pushed down by the status bar. I’ve never built an app before so sorry if this is a stupid question,

This is how it should look but it looks like this

Thanks in advance,


What version of Ionic?
What version of Cordova?
What plugins do you have installed?
What does the meta tag in your <head> look like?
Please paste in your config.xml file.


thanks for the response, here are the detials you asked for, It’s strange as it looks awesome on the simulator

Ionic version: 0.9.27
Cordova version: 3.4.0
What plugins do you have installed? None
What does the meta tag in your head look like?

config.xml, I’ve just replaced some personal details with #

Thanks again for the help :smiley: