Weird Bug That Only Happens on Chrome For Android

[DannyC]

Hi,

I’ve noticed that there seems to be a bug or inconsistency when viewing my staging site on chrome for Android.

Essentially, the section was created as a template and nothing was changed outside of that template other than the text.

When viewing this section on Android, the text appears much smaller than the rest of the body text on the page, which it shouldn’t.

• If you view the web design page on chrome/Android, the text appears correct, but every other page it’s much smaller.
• I’ve combed through every setting to ensure they are all the same, no change.
• I’ve saved the correct section as a templat and imported it, it worked until I updated the text and then it did the same thing again.
• If I change the screen size on desktop, it doesn’t happen, only on Chrome/Android

I’ve been scratching my head with this for a few days and at a loss now.

I’ve included screengrabs of the sections on desktop (mobile views) and android chrome, so you can compare.

Here are the live links:

Web design page (appears correct) - https://wordpress-227779-902472.cloudwaysapps.com/website-design/
SEO page (smaller text) - https://wordpress-227779-902472.cloudwaysapps.com/seo-services/

You can see this same thing happen on the homepage and the PPC page too.

Web design - Desktop - SAME

SEO page - Desktop - SAME

Web Design - Android/Chrome - Correct

SEO page = Android/Chrome - Wrong

I’ve included logins via a secure note

[nabeel]

Hi @DannyC,

Thank you for reaching out to us. I checked your SEO page in Android/Chrome and then compared it with the browser’s mobile view and I see the text correctly, the body text size matches with the text size in the Grid elements. I’ve attached couple of screenshots of what I’m seeing:

SEO Page - Android / Chrome:

SEO Page - Windows / Chrome:

This could be the cache problem, can you please check the site with another phone and clear it’s browser’s cache (please see https://theme.co/docs/common-issues#disabling-cache)

Let us know how this goes!

[DannyC]

Hi,

It’s definitely not a cache issue, this is a staging site so varnish, breeze cache and all other caching is switched off.

I’ve viewed the site in incognito and it does the same.
I’ve cleared the Android Chrome cache and it does the same.
I view it in FirefFox mobile and all the body text is the smaller size?? It should be 18px

Also when I’ve imported the template from the web design page and replaced the content, loading that page with the new section, still shows the smaller text on Chrome for Android. This should bypass the cache too because it’s an entirely new section that has been added. I even left both sections in to compare and it reverted to the samller text on that page.

Very odd.

[ruenel]

Hello @DannyC,

There is indeed a difference between the two texts.

Have you noticed the difference? The other one is wrapped by a <p> tag. This is what makes the difference. Please edit your page and make sure that they have the same structure including the paragraph, <p> tag.

If you need anything else we can help you with, don’t hesitate to open another thread.

[DannyC]

Hi,

Thanks for looking into this.

I can’t see the <p> tag when I look at the raw text field.

I’ve also deleted the text and copied it in from notepad without any styling, saved it, cleared cache, opened in incognito and the texts are still not balanced properly.

This doesn’t seem to happen on Firefox, Edge or Oprah (for android), so it must be an issue with chrome.

I’ve checked the site on a chrome book and it appears correctly.

I’ll load the site in a few other phones and see it persists.

Thanks

Dan

[ruenel]

Hello Dan,

I have checked both pages and you have removed the <p> from the Website Design page. They should look the same now. In mobile phones, you still need to clear the browser caches or use private browsing mode. When I check both pages in Chrome on my android phone, this is what I am seeing:

Please check both pages in your mobile again.