[Resolved] Image and Text in Gutenberg

Home Forums Support Image and Text in Gutenberg

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #954359
    Robert

    I am starting a new website project and am trying Gutenberg. I am struggling with the very simple task of making an image align with text the way I want. This is the test website:
    http://www.mofsa.org/test2

    You will see three menu choices at top. “Classic” shows using the Classic Editor plugin and doing image and text the way I am used to doing it, and it works fine.

    My task is to do a makeover of this website: http://www.sma-us.org. I want to use GP, and I hoped to use Gutenberg.

    But when I used the Gutenberg editor, the text is indented from the title, and the image does not align at the top. “Gutenberg” menu choice.

    “Full Width” shows another attempt, and that looks terrible!!

    Any suggestions? If there is not an easy fix, I think I want to stick with the Classic Editor plugin for this project.

    #954402
    Leo
    Staff
    Customer Support

    Hi there,

    So by default Gutenberg both texts and image center as illustrated here:
    https://www.screencast.com/t/oSxrS3V8W

    We can use this CSS to change that:

    .wp-block-media-text .wp-block-media-text__content {
        padding-left: 0;
    }
    .wp-block-media-text {
        align-items: inherit;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    Let me know if this helps 🙂

    #954412
    Robert

    Thanks, Leo. That worked perfectly!

    #954434
    Leo
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.