How to Center Pages Titles?


#1

Hello Team,

I am unable to center the header text titles on my pages.
In web view its centered in Android it comes to left.


<ion-view title="Home" id="page1" style="background-color:#2C9AE2;">
  <ion-content padding="true" class="has-header">

I have tried align-title=“center” on ion-view-title but it does not work…


#2

<ion-nav-bar class="bar-positive" align-title="center"> doesn’t work ?
if not, try :

ionicApp.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider) {

$ionicConfigProvider.navBar.alignTitle('center')
});

#3

There is no nav-bar in the page:

For eg: Blank page

<ion-view title="Settings" id="page10" style="background-color:#2C9AE2;">
  <ion-content padding="true" class="has-header"></ion-content>
</ion-view>

so how can I make sure that Settings title come @ center in android


#4

.page10{
text-align:center;
}


#5

@kocei
Thank you but after adding css style to ionic.css it does not work


#6

Can you show me your whole template ?


#7

@kocei

Here is the template:

<ion-view title="Settings" id="page10" style="background-color:#2C9AE2;">
  <ion-content padding="true" class="has-header"></ion-content>
</ion-view>

This is what I get when I create a blank page and I have many blank pages like this one.
In web view the title of the page is centered but in android it comes to left

for sidemenu I was able to do add

<ion-header-bar align-title="center" class="bar-stable">

add it worked but its not working for the pages titles…