Font appears different in different browsers

Support
#1

Hi,
I updated theme on staging and font started to appear different in different browsers.
I use google font (Lato) Also, I checked that my staging site is completely https.
Can you please assist me on this.

Thank you,
Tarnum

#2

Hi Tarnum,

This is how I can see your web page on Chrome:


And this is how I can see it on Firefox: https://snag.gy/FPHDIA.jpg

I can see both are the same, would you mind let me know on which browser exactly you got different result? also, sharing screenshots would be helpful.

Thanks.

#3

Hi,
Following is what I see:
On chrome: https://snag.gy/uhQdgc.jpg
On Mozilla: https://snag.gy/QLRTb7.jpg

Font + font weight is different.
Thank you

#4

Hi,

Yes, I can see the difference, however, I double checked this issue with one of my colleagues and he also can see the fonts are the same as in the screenshots I’ve shared previously.

Most probably, this is a caching issue, try to delete cache from your site and from your web browser, also try to visit your website from different devices to confirm that this issue a caching issue.

Thanks.

#5

Hi,
My staging doesn’t have any caching.
Not sure how is caching affecting.

#6

Hello There,

I’ve taken a closer look at your page and it seems that you have inserted an invalid html code which may have caused this issue.

Please go over with your page and make sure that you have properly closed each of the html tags. Unclosed tag will create an issue and will sometimes messed up the page layout.

Please let us know how it goes.

#7

Hi,
It’s not only this page, it’s all across the website.
Font weight and size is completely off.
You can compare production to staging. Staging is where I am testing the updates. It’s the exact same code on all the pages as on production.
Production: https://www.2020spaces.com/
Staging: https://tech2020.staging.wpengine.com/

Thank you.

#8

Hello There,

This is how I see your site from my Firefox and my Chrome browser:
Chrome: https://prnt.sc/k67ran
Firefox: https://prnt.sc/k67rt2

Please understand that browsers renders the element differently especially if you have inserted an invalid code. Chrome may ignore the incorrectly element, but Firefox doesn’t. Please go over the pages and inspect your codes. Make sure that you have inserted a correct and valid html code. One missed closing </span> tag will make a big impact on the styling of your page.

Hope this helps. Please let us know how it goes.

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.