Not displaying correctly in Instagram browser on android

Hi,

I have a strange issue where my site won’t display correctly on the in-app browser on Instagram. i.e When people click on a link from Instagram to open the site.

Android Chrome: (correct)

Instagram in-app browser:

The problem can be seen in the way that the words ‘mysteries’ overlaps ‘of’ and ‘Trust’ overlaps ‘Sangharakshita’ in the header logo.

The problem does not persist on iOS, and it also does not persist on other in-app browsers (e.g Twitter).
For reference, here’s the Twitter in-app browser (displaying correctly)

Does anyone know what this could be due to? The only thing I can think is it’s something to do with where the viewport top or bottom is being set… Not sure though.

Many thanks in advance.


Here is my site Read-Only: LINK

Hi,

I don’t have any solution for you, but I just came here to say that I’m having the same issue. When the website is displayed in the Instagram’s browser, none of my links in the nav-bar are going to the right page.

Maybe if you share the read-only link we can check what is wrong

I have the same issue. Please see my attachments. When viewed from a linked clicked in instagram (was sharing a link via a private message), the headings have big gaps in between ‘Editor’, ‘From’ and ‘Southsea’

https://preview.webflow.com/preview/solid-coast?utm_medium=preview_link&utm_source=designer&utm_content=solid-coast&preview=fcf8011f081853101735b30b898a5190&pageId=64e67d691985d5b8e6e23d26&workflow=preview