# Header bar title issue on iOS

**URL:** <https://forum.ionicframework.com/t/header-bar-title-issue-on-ios/34044>\
**Category:** ionic-v1\
**Created:** [October 7, 2015, 9:24am UTC](https://forum.ionicframework.com/t/header-bar-title-issue-on-ios/34044 "2015-10-07T09:24:57Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![kinkaz](https://avatars.discourse-cdn.com/v4/letter/k/82dd89/32.png) [@kinkaz](https://forum.ionicframework.com/u/kinkaz)\
**Post date:** [October 7, 2015, 9:24am UTC](https://forum.ionicframework.com/t/header-bar-title-issue-on-ios/34044/1 "2015-10-07T09:24:57Z")

</div>

Hello,

I am having an issue on iOS (both xcode emulator and device) . The title is not correctly displayed in the header-bar (screenshot on the left side).

 ![image](https://global.discourse-cdn.com/ionicframework/original/3X/6/3/6307b68c0157f8fafcf33943fde8eba80d04336c.png)

My code is for the header-bar is :

```
<ion-header-bar>
        <ion-nav-bar class="bar-light">
            <ion-nav-back-button class="button-clear"></ion-nav-back-button> 
        </ion-nav-bar>
 </ion-header-bar>

```

Note that on Chrome / Firefox and the Android emulator + device (screenshot on the right side), everything’s perfect.

Does anyone have any idea how to fix this 😊 ?

Thanks

---

<div class="post-metadata">

**Author:** ![kinkaz](https://avatars.discourse-cdn.com/v4/letter/k/82dd89/32.png) [@kinkaz](https://forum.ionicframework.com/u/kinkaz)\
**Post date:** [October 12, 2015, 12:12pm UTC](https://forum.ionicframework.com/t/header-bar-title-issue-on-ios/34044/2 "2015-10-12T12:12:25Z")

</div>

If anyone has the same problem, I solved it following these 2 steps

1. Install the cordova status bar plugin [https://github.com/apache/cordova-plugin-statusbar](https://github.com/apache/cordova-plugin-statusbar)
2. In the “run” method of your app, add **“StatusBar.overlaysWebView(false);”**
3. Override the SASS variable **$ios-statusbar-height** and set it to 0px (last line of "lib/ionic/scss/\_variables.scss)

---

<div class="post-metadata">

**Author:** ![danielpt](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/danielpt/32/95937_2.png) [@danielpt](https://forum.ionicframework.com/u/danielpt)\
**Post date:** [January 5, 2016, 6:49pm UTC](https://forum.ionicframework.com/t/header-bar-title-issue-on-ios/34044/3 "2016-01-05T18:49:00Z")

</div>

i try this but don’t work =(

---

<div class="post-metadata">

**Author:** ![rarejai](https://avatars.discourse-cdn.com/v4/letter/r/e274bd/32.png) [@rarejai](https://forum.ionicframework.com/u/rarejai)\
**Post date:** [January 6, 2016, 3:25am UTC](https://forum.ionicframework.com/t/header-bar-title-issue-on-ios/34044/4 "2016-01-06T03:25:27Z")

</div>

I have the same issue for weeks and just fixed right now. I put the following line in config.xml instead of the “run” method.

`<preference name="StatusBarOverlaysWebView" value="false"/>`

And then I also remove cordova-plugin-statusbar and install it again.