Cover & Group blocks: Add Margin Control

[iamtakashi]

It'd be nice to be able to control margins for Cover and Group blocks.

For example (the pink rectangle is illustrating the margin):

With the vertical margin, the header looks taller than how it's intended.

Obviously, I can "fake" it by reducing the bottom padding in the header, but that doesn't feel right, and there will be a problem as soon as the user adds a background colour to the header.

What problem does this address?

It helps create designs with gapless "sections".

What is your proposed solution?

Add Margin control like Columns block

[ndiego]

I know there has been a TON of conversation about adding dimension controls to blocks, specifically margin. But I think a happy compromise could be adding margin to "container" blocks. The Columns block already supports margin and adding this to Group and Cover would solve many edge cases. This would go a long way in solving issues like this ticket which are impeding many FSE designs. If we can get some consensus on this, I will drop everything and write the PRs myself 😉

[jasmussen]

We've certainly been back and forth on this. Also enough at this point, probably, that we could look at some changes to the approach. Here's a thought:

• We add margin to a few blocks, like Cover and Group for start.
• It's added as a not-shown-by-default option in the ToolsPanel.
• This addition should not block further explorations, notably in-canvas improvements like outlined in Contextual Block Padding (Spacing) Controls #33221.

The reason to move carefully, as stated over many issues, is that margins are difficult. They are hidden, they collapse, they can't easily be copy/pasted, or have presets.

From this Figma, here's an older mockup for what an inspector margin control could look like: