Block Styles: Layout changes when selecting background colors.

[Addison-Stavlo]

The Issue

In FSE lets take the header in tt1-blocks as an example. If we change the color setting of a wrapper block inside the header, the layout of all the blocks shift as a result:

This behavior is the same whether it was the recently removed color setting of the template part block, an internal group block wrapping the inner content, an internal columns block, etc. Nor is it limited to the template part. This is reproducible with the majority of blocks, even the paragraph. It is not limited to FSE or tt1-blocks as we can reproduce with blocks in twnety-nineteen and other themes, however it seems like a vitally important problem to solve for FSE.

What I would expect

Color settings and layout/padding settings to operate independently. Blocks should have the same paddings and alignment regardless of whether or not the user has added a custom background. I should be able to change the background color of my header (or any other block) without any other visible changes.

Why is this an issue

Conflating layout properties with color properties imposes unnecessary limits on the styles that are possible of achieving within the editor. If we want to give users the power to customize styles in the editor without a need for custom CSS, this requires resolution.

[carolinan]

Related:
#30725