My title in the application is not centered on iPhone, but it appears fine when accessed through a browser. How can I fix this issue? Here is my HTML code:
<div data-view="Moobile.ScrollView" class="component-testpage-view">
<div data-role="navigation-bar" class="center">
<div data-role="button" data-name="back-button" data-style="back">
<div class="back"></div>
</div>
<div data-role="title" class="bar-center">Найдено</div>
<div data-role="button" data-name="favorite" class="bar-right">
<div class="best"></div>
</div>
</div>
<div data-role="content" data-name="category-field">
<div class="activity-text">Загрузка</div>
<div data-role="activity-indicator" data-name="activity-indicator" class="activity-indicator active"></div>
</div>
</div>Here is my CSS code.
.main-background {-webkit-transition: all 0.5s; -webkit-transform: translateX(-50px); top: 44px;} .button-top {/overflow: auto; margin-top: -10px;/} .in-right {position: relative; height: 55px;}
.bar.navigation-bar.center .bar-item .bar-title-wrapper {pointer-events: none;} .bar.navigation-bar.center .bar-item .bar-title {height: 44px; line-height: 44px; left: 0px; position: absolute;}