Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support David Smith

    (@get_dave)

    Hi Gary,

    If you are using the latest Gutenberg Plugin then the built-in Media + Text block is the way to go on this one.

    It comes with a “Stack on mobile” option which allows you to choose to stack the image and text on smaller viewports.

    You can also adjust the layout of the image (left/right) and vertical alignment (top/bottom). Whilst the image block & paragraph block combination is usually sufficient, in specific circumstances such as yours the Media+ + Text block provides greater control over your content.

    I recorded a quick video to illustrate what I mean. I hope that helps?

    Thread Starter Garry Rigby

    (@indigojones66)

    Ah, that was easy. Fantastic, thank you again David. Hope you have a great weekend. Regards Garry. Great voice by the way ~ you should be a doctor or on the radio

    Thread Starter Garry Rigby

    (@indigojones66)

    One problem with this method is the text does not wrap around image…https://heritagecountrypottery.com/abouts/

    Plugin Support David Smith

    (@get_dave)

    Great voice by the way ~ you should be a doctor or on the radio

    I appreciate the complement! 🙂

    One problem with this method is the text does not wrap around image…https://heritagecountrypottery.com/abouts/

    It’s a tricky one. You could move some of the text into a paragraph block below the Media + Text. That might reduce the severity of the effect.

    Another option is adding some custom CSS to your Theme to cancel the alignment on certain screen sizes.

    For more on this see the Fixing left and right image mobile alignments with CSS section of this article.

    Perhaps we need a way to make inline images stack on mobile. I raised an issue in the Gutenberg repo to track this as a potential requirement.

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

The topic ‘force a wrapped image to stack on mobile’ is closed to new replies.