F7 V2 fixed navbar title not centered in iOS

Questions
1

Hi,

I’ve got a little problem with fixed navbar title on iOS.

I’ve got navbars on every page, because they are different.

There is code of fixed navbar with title:
< div class="page"> < div class="navbar normal"> < div class="navbar-inner"> < div class="left"> < a class="link icon-only back"> < img src="./img/arrowW-back.png"> < /a> < /div> < div class="title">Лекции, семинары и тренинги</div> < /div> < /div><!-- .navbar --> < div class="page-content"> ... < /div> < /div>

Title is centered on Android, but on iOS it’s not.Capture

I tried to resize it:
app.on(‘routeChanged’, function(newRoute, previousRoute, router){
app.navbar.size(’.navbar’);
});
but it doesn’t help.

Is it my fault?
Thnx.

2

According to your code page-content is in navbar! Looks like you forgot to close one div tag

3

I just added … not to add anything after .page-content =)
Now I edited first post and added close tags to .page-content and .page

4

Ok, then it should work as everywhere else, problem seems to be somewhere else. Do you have a live example so i can take a look?

5

here it is:

http://dailybmw.ru/peterburg2/app/#!/type-list/?id=1

and every page with red fixed navbar.
On PC and android everything is ok.
But If I go to the next page on iOS, than title will be not at the center. If I will go to the previous page, than title can be at the center.

6

In chrome and iphone layout got this problem.
Don’t know why, but F7 add left -134px to navbar title.
I add css rule .navbar .title {left:0 !important} and now title is in the center.

7

It happens, because you have a lot of custom styles on navbar and it is elements, and your styles break default centering

1 Like