Row Block: Custom width for Image Block isn't respected within the Row Block

[hacchism]

Context and steps to reproduce

If you add an Image Block and something else (i.e. Paragrah Block) into a Row Block, the image just gets smaller and smaller as you put more content into the other block even if you set custom width for the Image Block.

Steps to reproduce the issue:

1. Activate one of the FSE themes. (i.e. Kentwood, TT5)
2. Create a new page and add a Row Block.
3. Add an Image Block and a Paragraph Block within the Row Block.
4. Set a custom width for the Image Block.
5. Check how the image appears on the live page depending on the volume of the content (text) you add into the Paragraph Block.

If you add lots of text into the Paragraph Block, the image eventually disappears.

Screen.Capture.on.2025-01-23.at.16-44-55.mp4

Site owner impact

Between 20% and 60% of the total website/platform users

Severity

Moderate

What other impact(s) does this issue have?

No revenue impact

If a workaround is available, please outline it here.

• I've tested this with the Kentwood and TT5 theme only so far, but I guess this can be reproduced in other FSE themes.
• I haven't tested it out on Atomic sites yet.
• The workaround would be using the Columns Block.

Platform

Simple

[supernovia]

📌 REPRODUCTION RESULTS

• Tested on Atomic – Replicated

📌 FINDINGS/SCREENSHOTS/VIDEO
I'm guessing that when we don't allow the rows to wrap, the system has to resize something and chooses to resize images rather than make very narrow paragraphs or create side-scrollbars. So I am guessing this is by design. Here are some screenshots that may help:

The settings / wide screen in the editor

How it would look on mobile if we prioritized image widths

How it looks now

How it looks if we allow wrapping

📌 ACTIONS

• Requested author feedback

📌 Message to Author
@hacchism if the images didn't resize, the paragraph would likely become too narrow to read. Does using the "Allow to Wrap" toggle help?

[hacchism]

Thanks @supernovia.

I'm guessing that when we don't allow the rows to wrap, the system has to resize something and chooses to resize images rather than make very narrow paragraphs or create side-scrollbars. So I am guessing this is by design.

This does make sense. Still, image disappearing in the end (depending on the content volume in the other block) feels off, though.

@hacchism if the images didn't resize, the paragraph would likely become too narrow to read. Does using the "Allow to Wrap" toggle help?

Yes, it does, but only in certain situations.

I'm also tagging @Greatdane here in case he has something to add. He got a related user report originally: 9321457-zen

[github-actions]

Support References

This comment is automatically generated. Please do not edit it.

• 9321457-zen

[Greatdane]

Allow to wrap to multiple lines doesn't solve the original issue for the original reported user; 9321457-zd-a8c
(it just stacks no matter what)

For now, I changed to two columns as a work around.

[Robertght]

This has been discussed in more detail here: WordPress/gutenberg#68057

To quote another contributor:

It’s actually the size in the editor that is incorrect because it was decided that the Row block shouldn’t (by default) allow making unresponsive designs—discussion here: WordPress/gutenberg#45364 (comment).

I'm going to close this on our end as it should be addressed in core and it's already working as intended in the frontend.