Header and Footer displaying wrong on WebKit

Hey,

I’ve noticed my header and footer don’t display correctly on browsers using WebKit. I’m currently on a Windows computer so the screenshots are from Midori. I’ve noticed a previous similar post in the support forums where the follow up suggested that the issue might be down to an older Safari version, but I’ve found the same issue on Safari 12.0.3.

Images here

Cheers!
Joe

Hi @JSW88,

Thanks for writing in!
Can you please send your website URL so that we can have a look in Safari?
There is no similar issue has been reported in the Safari new version, to look on to your issue we need the URL first so that we can suggest you better.
The website attached to your license is something different than the screenshot you have shared, please confirm.

Thanks

Hi @basanta,

Yeah, my client purchased the license for the website in question. I can provide the license details if you need them?
URL is tealeaftrust.com

Cheers!

Hi @JSW88,

I could see that you’ve added the left & right margin to navigation inline element:

Please change them to 0.

The footer looks good on my end(MacOS Mojave & Safari):

Hope it helps :slight_smile:

Hey @thai,

Thanks for your reply! I’ve changed these settings but it’s still rendering wrong for me on MacOS. Also on iOS the second level of the drop down goes offscreen:

Actually, on my last CrossBrowser test it seems to be working for Desktop. Possible that my friend was loading a cached version of the website! I’ll keep testing.

Here’s how BrowserStack is loading the website on an iPad Air 2, albeit on iOS 8 and Mobile Safari 10.0:

Hi @JSW88,

It looks fine on my end, please clear your browser’s cache and all caching features that your site might have.



Thanks,

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