Adding Buttons hides Nav-Title

ionic-v1
1

I have the nastiest issue:

My Navbar is currently part of the View, as such:

<ion-view  animation="no-animation" hide-back-button="true">
   <ion-nav-bar class="bar-someclass" align-title="center">
   <ion-nav-title style="display:block!important">{{Variable}}</ion-nav-title>
   </ion-nav-bar>
</ion-view>

Works perfectly.

But when I add a ion-nav-buttons to the left or right side, the Nav-Title won’t be shown. Inspecting it, I can see that two styles are being added dynamically, which happen to cause the Nav-Title to not show properly.

<div class="title title-center header-item" style="left: 558px; right: 558px;">
      <span class="nav-bar-title ng-binding">{{Variable}</span>
</div>

How to fix this?

Edit: It does work as expected when I place the button to the Right.

2

Did you ever solve this, because I’m getting the same problem - a dynamic style is setting the right and left values and pushing the Title off the screen - but only occasionally. My view looks like this:

<ion-view>
    <ion-nav-title class="black_background yellow_text title">
        {{server.nickname}}
    </ion-nav-title>
    <ion-nav-buttons side="primary">
	<a name="cancelbutton" ng-show="platform != 'android'" href="#/app/servers" nav-transition={{buttonTransition}} nav-direction="back" class={{cancelclass}}>
	     {{canceltext}}
	</a>
     </ion-nav-buttons>
     <ion-content class="black_background yellow_text">
     ....

I should note this only happens on iOS - on Android the titles are just fine.