Undue white space appears for images with figcaption

  • Resolved Lucid Gen

    (@lucidgen)


    3 years, 4 months ago

    Hello,

    When viewing AMP pages directly on mobile devices (Not in Chrome device toolbar). I found a lot of unnecessary space that appeared with the image with figcaption.

    This adversely affects the experience on AMP articles.

    Screenshots: https://ibb.co/GQf8JQn

    Most of the sites using this AMP plugin have this problem at the moment.

    Please check and fix this, and if possible give me a temporary solution.

    Thank you!`

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

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter Lucid Gen

    (@lucidgen)

    I found this problem with the Gutenberg editor, and the problem is in figcaption.

    I have tried adding Custom AMP CSS to hide the figcaptions, and as a result the images show up in the correct position.

    But hiding figcaption is not a good solution. Please check the AMP plugin again with Gutengerg image block with align center format and fincaption.

    Thank you very much!

    • This reply was modified 3 years, 4 months ago by Lucid Gen.
    • This reply was modified 3 years, 4 months ago by Lucid Gen.

    Thanks for reaching out. We did have a previous support topic open in relation to this although in this case it was a webkit rendering issue, with the impacted user reporting from a Safari browser. We were unable to recreate this on any other browser.

    In your case can you confirm the browser you’re using, while sharing the code snippet you applied or temporarily removing any AMP specific CSS rules for your figcaption? The AMP plugin doesn’t add any additional styling to figcaptions specifically for AMP URLs, we’d then be happy to investigate this further.

    Thread Starter Lucid Gen

    (@lucidgen)

    I face the problem on Safari, Chrome, Firefox on iPhone X.

    I added CSS display:none for figcaption. Hope you can give a solution to resolve it 100%.

    Thank you very much!

    Thread Starter Lucid Gen

    (@lucidgen)

    .wp-block-image [class^=’align’] > figcaption {
    display: block;
    }

    Work for me, I think I resolved this problem. Thank you and Github team!

    Excellent, thanks for the update! Glad to hear that worked for you.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Undue white space appears for images with figcaption’ is closed to new replies.