V18 viewing errors in Mac OS

[EdHarrison]

I have had customers report my website isn't viewing correctly in it seems Mac devices between 800px and 1200px screen widths. That looks to be the problem screen widths when testing in developer tools in my browser. Mine shows a broken view in Chrome on a PC at those resolutions to.

The menu and layout looks like a blend of mobile and desktop view, anyone else noticed this on their V18 swift site?

Below is a screenshot a customer sent from his Mac in chrome browser.

Thanks Ed

[John Ennals]

Ed,

Looking at your site on a Windows PC, it is not appearing correctly in Chrome or Edge even on wide screens - the top links in the megamenu bar are aligned left rather than centred. However in Firefox the site displays correctly at all widths.

John

[EdHarrison]

Thanks John, I have missed this issue as my primary screen is 32" with Firefox and my Samsung S22 are both fine, quite frustrating to discover this, probably been like it since I went to V18.

I'm guessing chtome, edge and mac are the ones with issues.

Android and Firefox seem ok.

[John Ennals]

It would be interesting to know if the problem appears on Apple devices using the Safari browser. I suspect the issue may be related to Chromium-based browsers (i.e. Chrome and Edge).

I had an issue on my site where it displayed a mix of mobile and desktop formats at one particular screen width in Chrome/Edge, which I ignored because the issue disappeared if I expanded or contracted the browser width by 1 pixel! However, this problem seems to have vanished altogether now, presumably as a result of new browser versions being released. Therefore your issue may not have existed when you first changed to Swift, but may have appeared later as the result of browsers being updated.

[EdHarrison]

Very good point thanks John, browsers must change
Raised a support ticket a day or two.ago so will wait and see what they find and update here in case it affects others.

[EdHarrison]

Sadly no response since rasing the ticket last Wednesday with support.

My guess is a fix would be to retain mobile view until at least 1000px width....assuming that's possible.

[John Ennals]

Your site isn't displaying correctly in Edge/Chrome at any width, so it would be best to get to the root of the problem. Are you on SDD 18.1.2 and Swift V1?

[EdHarrison]

Thanks John, oh dear, yes 18.12 with swift v1. I'll add that to the open ticket.

[EdHarrison]

Another friend sent this with chrome on a pc.

[EdHarrison]

Massive thank you to Jonathan Chappell (Graphicz) who again performed a miracle, it looks great again in Chrome.

[graphicz]

Sorry for delay.

There were some css errors that were tolerated previously by Chrome and Firefox but which the latest Chrome did not tolerate.

It is worth checking the css: Do an off line preview and view page source. Click on actinic.css and save file.

It is likely minified so unminify using this: https://elvin.tools/developer-tools/css-unminify/

Copy and paste content into: https://jigsaw.w3.org/css-validator/#validate_by_input

There may be a number of parse errors and deprecated expressions.

Remember to look at magiczoomplus.css and webslidemenu.css which are incorporated into actinic.css if you cannot find something in 'Current Stylesheet' in Sellerdeck.