Stretched sections bug on iOS

  • Stretched full-width Sections are jumping off to the side when I scroll on my iOS device (Safari and Chrome on iPhone 6). I haven’t yet confirmed whether this is a problem on more devices or browsers. Here’s a screencast of the dev tools via BrowserStack to better illustrate what’s happening:

    I’m using stretched sections for some hero content scattered through the page; notably, the “Come grow with…” and “it’s what’s inside…” parts that are seen in the recording. I observed these sections jumping off to the right whenever I scrolled on my mobile device. When pushing the page upward (“scrolling down”), the browser interface minimizes the URL bar at the top, and that causes the content to jump, for reasons I can’t identify. When pushing the page downward (“scrolling up”) at sufficient speed to cause the URL bar to expand again, the content returns to its intended position. I was unable to replicate this with desktop Chrome’s built-in device imitation, probably because it doesn’t have same the URL UI my actual mobile device has, but I could see it when using BrowserStack. The recording has some lag here and there, but it shows how the margin-left jumps from negative values to zero and back again when scrolling up and down.

    Is there a way to corral the margins regardless of what the native UI is doing?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter darbielee

    (@darbielee)

    (also, +1 vote for being able to set custom breakpoints if the WordPress defaults aren’t cutting it, since I’ve seen that come up a bunch in the support topics, and sometimes all that matters for getting approvals is making sure some higher-up’s special snowflake device renders things as they expect rather than by such silly concepts as “global standards”)

    Plugin Author Andrew Worsfold

    (@andrewworsfold)

    Hi @darbielee –

    The full-width section feature does appear to behave strangely in some circumstances, which I will investigate further with the goal of releasing a fix. Using some simple custom CSS to achieve the same effect is always recommended over JS, where possible.

    In terms of custom breakpoints, I agree: that’s a worthwhile feature to have (especially given the defaults which are inherited from WordPress’ Customizer). Unfortunately it has wide reaching effects and is therefore quite a lot of effort. It’s on my list and hopefully we’ll see someone help out on the GitHub project.

    Cheers,
    Andrew.

    Thread Starter darbielee

    (@darbielee)

    Thanks! If there is any CSS you discover/recommend to fix this before a whole new release is ready, let me know here and I’ll try it out.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Stretched sections bug on iOS’ is closed to new replies.

Tags