Autoptimize disrupting layout

  • Yesterday I was alerted to some layout problems with my site on mobile. My site’s posts have a main content area with a right sidebar. When the screen becomes narrow enough for the sidebar to reposition at the bottom, the main content is not filling the space vacated by the sidebar. Instead, the main content just continues to become narrower as the screen becomes narrower, leaving white space across most of the right side of the screen.

    When you scroll down to the bottom, I can see the sidebar content filling the full width of the screen as intended, so this layout problem seems to be only with the main content area.

    I deactivated plugins one-by-one and the problem resolves when Autoptimize is deactivated. I checked with GeneratePress support, and their feeling is that Autoptimize is scrambling the order of the CSS. Is there anything you can do about that?

    (I currently have the plugin deactivated, so you’re unlikely to see the issue by visiting the site.)

    Thank you!

    The page I need help with: [log in to see the link]

Viewing 15 replies - 16 through 30 (of 42 total)
  • Thread Starter erikrolfsen

    (@erikrolfsen)

    I am a Critical CSS customer. Morgon Ltd. bills me each month for it.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    OK, can you go to Settings -> Autoptimize -> Critical CSS -> Advanced Settings and enable “unload critical CSS at page load” and test if that helps?

    Thread Starter erikrolfsen

    (@erikrolfsen)

    That worked as well. (I assumed you wanted me to re-enable “remove render-blocking CSS” first.)

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    Great news, that means we finally managed to track down and fix this?! ??

    Thread Starter erikrolfsen

    (@erikrolfsen)

    I guess so. So I’ll just leave that enabled from now on?

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    indeed ??

    Thread Starter erikrolfsen

    (@erikrolfsen)

    Great, thanks for your help!

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    you’re welcome, feel free to leave a review of the plugin and support here! ??

    have a nice weekend!
    frank

    Thread Starter erikrolfsen

    (@erikrolfsen)

    Hi Frank! I just received an email from a reader who is seeing this again. (I have made no changes.)

    I cannot recreate it myself, but what I do see is the problem happening for about 0.5 to 1 second while the page loads, and then everything expands to fill the page and looks normal.

    Does this tell you anything about what might be happening, or the best way to correct it for any readers who are finding it impossible to read?

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    there seems to be a problem with the critical CSS for that post, can you delete the is_single rule so it can be re-generated?

    Thread Starter erikrolfsen

    (@erikrolfsen)

    OK, have done that.

    Thread Starter erikrolfsen

    (@erikrolfsen)

    Hi, I’m just following up on this. While the pages do eventually render properly, for the first couple of seconds everything loads on the left side of the page, with white space on the right. It spreads out to fill the page afterward. As a result of this, the site is getting poor CLS scores and suffering. Any idea what might be causing this temporary shift of everything to the left side of the page as the content loads?

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    based on your description that could be a problem with the critical CSS erikrolfsen, but when looking at your site you have critical CSS off currently?

    Thread Starter erikrolfsen

    (@erikrolfsen)

    I have “Eliminate render-blocking CSS?” disabled, which I did shortly before I posted my message last night.

    When I look now, the CLS problem seems to have stopped. So maybe this has helped?

    I’m not sure what the negative tradeoff of doing this would be, but I’m inclined to leave it disabled and see if CWV scores improve. Would you recommend that?

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    best would be to keep “Eliminate render-blocking CSS” enabled but fixing the problem with the CCSS ?? was the issue present on all pages or on specific ones?

Viewing 15 replies - 16 through 30 (of 42 total)
  • The topic ‘Autoptimize disrupting layout’ is closed to new replies.