Can’t overwrite body overflow

  • Resolved miguelmorera

    (@miguelmorera)


    3 years, 5 months ago

    Hi all! I am developing a custom WordPress theme and now I am using this plugin to adapt to AMP in Transitional mode. The thing is I have an issue with the style applied to the body:

    html.i-amphtml-fie>body, html.i-amphtml-singledoc>body {
    overflow: visible!important;
}

    I have some images that are making the body content smaller due to this overflow. So I can’t set !important on custom style to overwrite this, there is something I can do to solve this issue?

    Thanks in advance.

    • This topic was modified 3 years, 5 months ago by miguelmorera.
Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support Milind More

    (@milindmore22)

    Hello @miguelmorera

    Thank you for the support topic, The style is added by AMP runtime script something we can’t control in the AMP plugin, Please share your site URL or Pastebin link of Page source we might be able to suggest a fix for your image issues.

    You can share your site URL and Site health information using this form privately

    Thread Starter miguelmorera

    (@miguelmorera)

    Hello @milindmore22

    I’m afraid that I can’t share you a site URL because I am local developing at this moment. Here is two PasteBin with HTML and CSS separately.

    HTML: https://pastebin.com/RMvL1H7Y
    CSS: https://pastebin.com/WFa3vnP8

    Thanks for your answer.

    Plugin Support Milind More

    (@milindmore22)

    Hello @miguelmorera

    I tried to add your Pastebin to AMP playground but it’s difficult to understand/ reproduce the issue at my end with code as source of images being served from local.

    If you can setup a dev site or test site using some free services like jurassic.ninja
    it will be more helpful for us to assist you better.

    You can also try adding height and width attributes to images or try adding different layout types to the image container

    Hope this helps!

    Thread Starter miguelmorera

    (@miguelmorera)

    Hello @milindmore22

    I have solved my issue by adding an additional <div> after the initial body tag and I have set the overflow hidden to that <div>. Normally I don’t like solutions that consists to add more markup but, now is working fine so, that’s what matters.

    Also I have followed your instructions about setting width and height in the images of the website and I think now I have an acceptable experience in the AMP version.

    Thank you so much for your help!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Can’t overwrite body overflow’ is closed to new replies.