NavBar and Android Content Shifting Issue with Calculations

1

I have a main navigation page where I want a logo to be centered in the middle of the navigation bar. Everytime I scroll the page down the logo is shifted to the far left of the screen as shown below. When I view the source in Chrome I notice the “center title” div shown below get an inline style “left:” appended. However on Android this inline style never gets applied and the default is “left:0”. This appears to be the root cause however I cant seem to resolve. I took a look at the fw7 javascript and I see where this is calculated but from what I understand it only calculates for IOS and MD appears to not be there. Any idea how I can resolve? I using FW 5.7 all standard css and js files.

Here is what I see:

Here is what is rendered and the difference between IOS and Android

<div class="center title" style="left: 161.5px;">
        <div>
        <span style="margin-top:5px;">Logo</span>
        </div>
</div>

Screen Shot 2020-09-04 at 12.55.43 PM
Screen Shot 2020-09-04 at 12.55.43 PM982×138 6.89 KB 

<div class="center title">
         <div>
        <span style="margin-top:5px;">Logo</span>
        </div>
</div>

Screen Shot 2020-09-04 at 12.56.04 PM
Screen Shot 2020-09-04 at 12.56.04 PM774×114 5.15 KB

Code

 <div class="navbar navbar-large navbar-transparent">
          <div class="navbar-bg"></div>
          <div class="navbar-inner">
            <div class="center title">
              <div>  <span style="margin-top:5px;">Logo</span></div>
            </div>
          </div>
        </div>

  <div class="page-content">.....