Add space-around and space-evenly justification options

[Sukhendu2002]

What?

Closes: #42536

This PR adds support for space-around and space-evenly CSS flexbox justify-content values to the Buttons block.

Why?

Currently, the Buttons block only supports basic justification options (left, center, right, space-between). Adding space-around and space-evenly gives users more precise control over button spacing and alignment, especially useful for creating balanced layouts with multiple buttons.

Testing Instructions

1. Insert a Buttons block
2. Add multiple button items
3. Switch to horizontal orientation
4. Test all 6 justification options:
   • Left, Center, Right (existing)
   • Space Between (existing)
   • Space Around (new)
   • Space Evenly (new)
5. Verify proper spacing behavior for each option

Screenshots or screencast

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: Sukhendu2002 <sukhendu2002@git.wordpress.org>
Co-authored-by: jasmussen <joen@git.wordpress.org>
Co-authored-by: henriqueiamarino <iamarinoh@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: andrewserong <andrewserong@git.wordpress.org>
Co-authored-by: mrwweb <mrwweb@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[jasmussen]

Nice PR, this seems valid to me, and I can potentially help with some icons. Before we go about that, I'd love broader input, @WordPress/gutenberg-design what do you think about these options?

[henriqueiamarino]

I’m echoing @jasmussen, @Sukhendu2002; for me, this is quite valid. However, within the themesdesign channel, we concluded that while space-evenly makes sense, space-around can already be achieved with regular justification and side padding, so it's not strictly necessary.

[t-hamano]

I think space-evenly is definitely useful. cc @tellthemachines @andrewserong

[andrewserong]

I think space-evenly is definitely useful.

Same here. I think the only real concern I'd have is how dense the justification controls might feel, but adding one more sounds reasonable to me.

If adding it to the flex layout, comparable changes will also need to be added to some PHP files for layout and navigation, I believe:

E.g:

gutenberg/packages/block-library/src/navigation/index.php

Lines 562 to 567 in a1b9f58

	$layout_justification = array(
	'left' => 'items-justified-left',
	'right' => 'items-justified-right',
	'center' => 'items-justified-center',
	'space-between' => 'items-justified-space-between',
	);

And:

gutenberg/lib/block-supports/layout.php

Lines 421 to 427 in d398d64

	if ( 'horizontal' === $layout_orientation ) {
	$justify_content_options += array( 'space-between' => 'space-between' );
	$vertical_alignment_options += array( 'stretch' => 'stretch' );
	} else {
	$justify_content_options += array( 'stretch' => 'stretch' );
	$vertical_alignment_options += array( 'space-between' => 'space-between' );
	}

[jasmussen]

Same here. I think the only real concern I'd have is how dense the justification controls might feel, but adding one more sounds reasonable to me.

Oh indeed, there's this control:

They would fit fine in this dropdown:

I wanted to try and see if that aligned in the inspector, but it didn't come together for me:

For that reason, I think this one needs a little design work. Let me put it on my laundry list and see if I can come up with something. Thanks all!