Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1493821

    Hi Gunter & team,

    We have hit a reproducible issue that we can’t find the root cause of that we would like your help with as it seems directly related to one specific Enfold ALB element. I’ll try and explain as clearly as I can and we have a staging site setup for you to test it with.

    If we choose to use a page as the Footer (and keep the socket) then we can see the issue. We have two pages on the staging site to be used as the footer:

    1. “Footer” – this is using standard columns and works perfectly.
    2. “Footer Grid Row” – this is using the Grid Row element and this is when the issue occurs. Switching the Enfold settings to use the “Footer” page instead of the one with the Grid Row resolves the issue. Switching it back and the issue occurs again.

    The issue ONLY occurs on mobile – you won’t see it on a desktop browser when in responsive design mode. You will need to test on a mobile. We have tested it on 3 different iPhones – all different models and all running different versions of Safari. Please test it on a mobile phone, logged out of the site, using Safari to see the issue.

    The issue is that when you load a page and try to swipe to scroll, the page appears to be “sticky” and doesn’t actually scroll. Eventually after a few tries it might work, but it takes multiple swipes and sometimes never scrolls at all. All pages on the site are affected by it, and it occurs ONLY if the footer pages is designed using the Grid Row element. If you remove the Grid Row or switch the footer to be a different page not containing a grid row element, the issue goes away.

    The odd thing is we have used grid rows in footers for other sites without issue. But with this site we are unable to due to this issue.

    I hope that makes sense, it’s a little hard to describe. Please see private for staging site.

    Thanks, look forward to seeing what you think.

    Regards,

    Tim

    #1493834

    Hey Tim,

    Thank you for the inquiry.

    We have found a few invalid css rules in the Quick CSS field and fixed them. We recommend reviewing the styles there and optimizing them further, for example by removing duplicate css media queries. We also added the following css code, which fixed the issue on a mobile emulation:

    @media (max-width: 768px) {
      .responsive #top {
        overflow-x: visible;
      }
    }

    Please make sure to purge the cache before testing.

    Best regards,
    Ismael

    #1493837

    Hi Ismael,

    Wow, super fast reply, thank you so much!

    And thanks for spotting those issues with the CSS, I had missed those in working with a legacy site and have now corrected them.

    This seems to have resolved the mobile scroll issue when using Grid Row, so thank you very much.

    Really appreciate the help as always.

    Tim

    #1493864

    Hi,

    Glad to know that this has been resolved! Please don’t hesitate to open another thread if you have more questions.

    Have a nice day.

    Best regards,
    Ismael

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Grid Row Footer & Safari Mobile Issue’ is closed to new replies.