Row block: Layout does not work when classic theme and editor is iframed

[t-hamano]

Description

Row block justification does not work when the following two conditions are met.

• Classic theme is enabled
• Editor is iframed (custom fields panel is not enabled)

Iframed (custom fields panel is not enabled)

The left and right auto margins (from .editor-styles-wrapper .wp-block) override the zero margin of child blocks (from body .is-layout-flex > *) in the layout. As a result, the child block will be centered left and right, regardless of the justification setting.

Non-iframed (custom fields panel is enabled)

This is the correct layout. Zero margin overrides the block's left and right auto margins.

Step-by-step reproduction instructions

• Enable one of the classic themes.
• Make sure that the custom fields panel is disabled via the Preferences panel.
• Insert a paragraph block inside a row block.
• Change the justification setting.

Screenshots, screen recording, code snippet

No response

Environment info

I have confirmed that this issue occurs with WP6.4 or later. In other words, you should be able to reproduce this issue with the following versions:

• WP6.4
• WP6.5 RC3
• Gutenberg trunk

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[tellthemachines]

Ooh I wonder what might have changed recently to cause this; pretty sure those styles were working last time I looked!

In any case, my quick testing shows it should be viable to reduce the specificity of the selector in the classic stylesheet to something like :where(.editor-styles-wrapper) .wp-block, which will still override theme styles attached to the figure element.

Another possible solution would be to exclude flex children from these styles be adding a :where(:not(.is-layout-flex)) in there somewhere. That might end up being a more viable solution if the reduction of layout style specificity started in #57841 goes forward.