Gutenberg Image Captions

  • Author
  • #68430

    I have been starting to try out the Gutenberg Plugin for WordPress in preparation for change to WordPress 5.0. All appears to work fine in the editor and looks how I want it but when I publish and view the website, the captions are compressed into a third of the area on the left hand side (Firefox and Chrome). See Interestingly, this is even worse when viewed with Microsoft Edge, where the caption is a single character wide. If I inspect the caption element, then unticking “display: table-caption” partially resolves the problem in that the caption is now on a single line but it extends beyond the boundaries of the image. I do not know if this is a conflict between the Tempera theme and Gutenberg. I have disabled all caching plugins or other ones that could appear to cause conflict.


    Cryout Creations mastermind

    Looks like Gutenberg applies some styling which doesn’t play nice with the theme’s own styling.
    Try adding this custom CSS to correct that:

    #content .aligncenter, #content img.aligncenter, 
    #content .alignleft, #content img.alignleft, 
    #content .alignright, #content img.alignright {
        display: table;

    If you like our creations, help us share by rating them on
    Please check the available documentation and search the forums before starting a topic.

    Thanks Zed, that worked perfectly. Hope it helps you too with getting the theme ready for the Gutenberg changeover.


    Thanks, Zed
    I tested the Gutenberg plugin today with Mantra theme and it appeared to be line breaking each space in the image caption, similar to the above. I tried   and it fixed it but what a hassle.

    This code may help but I will probably use the Classic Editor plugin until WP works out some of the kinks. I was surprised how many issues there was in the new editor interface. No wrapping images? Not WYSIYG? Sheesh.

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Gutenberg Image Captions’ is closed to new replies.