When I resize the image, it goes beyond the parent content.

[ddryo]

!!! : I'm sorry, I sent it in the middle of writing. I'm writing the continuation now.

Thank you for your development.

Please note that English may be inappropriate because you are Japanese.

Description

When I resize the image, it goes beyond the parent content. The image may stick out when some conditions are met.

###Case 1 : In the default theme, it happens just by changing the "% size" of the image.

This issue can be prevented by controlling max-width in .components-resizable-box__container.

For example, I was able to solve it by adding the following CSS.

.wp-block-image .components-resizable-box__container {
     max-width: 100% !important;
    height: auto !important;
}

Case 2 : Further problems occur when moving blocks.

I don't know the specific conditions yet, but for example, this problem may occur when moving an image to a column-block.

It cannot be solved if it is a solution to Case1.

For example, the theme "Arkhe" includes CSS that solves Case 1, but this Case 2 has occurred further.

( "Arkhe": https://ja.wordpress.org/themes/arkhe/ )

When this problem occurred, I looked into the DOM and noticed that the .components-resizable-box__container class did not exist.

Case 3 : As with Case 2, .components-resizable-box__container does not exist for mobile size.

The following image is a screenshot without the "% size" specified.

And the following image is a screenshot with "% size" specified.

WordPress information

• WordPress version: 5.6
• Gutenberg version: 9.8.2
• Are all plugins except Gutenberg deactivated? "Yes".
• Are you using a default theme "Yes". Twenty Twenty-One Ver.1.1

Device information

• Device: MacBook
• Operating system: Mac OS Catalina
• Browser: Chrome

[paaljoachim]

Hi @ddryo

Thank you for creating the issue!

Your issue is a duplicate of this issue: #12168
There are also other similar issues as well.
As your issue brings with it additional context I am not sure if we should close or keep it open.
@tellthemachines @jasmussen