Navigation block: "Space Between Items" doesn't show on front end

[annezazu]

Is there an existing issue for this?

• I have searched the existing issues

Have you tried deactivating all plugins except Gutenberg?

• I have tested with all plugins deactivated.

Have you tried replicating the bug using a default theme e.g. Twenty Twenty?

• I have tested with a default theme.

Description

When using the Space Between Items for the Nav block, it appears to work in the editor but doesn't correspond appropriately on the front end. This was found as part of the ninth call for testing for the FSE Outreach Program in this Tavern article.

I'm not quite sure if this might be related to this: WordPress/theme-experiments#280 and this: #33021 cc @jas

I'm also assuming this is a GB issue rather than a TT1 blocks issue. I tested with the Q block theme and found roughly the same issue (strangely setting the "space between option" caused the nav block to be aligned left without extra spacing cc @aristath :D ).

Step-by-step reproduction instructions

1. Head to the site Editor and add a columns block inside the header template part.
2. Add a Navigation Block inside one of the columns.
3. Add a few page links.
4. Select the overall navigation block and, using the block toolbar, select the "Space Between Items" option under the alignment options and save changes.
5. Notice that the editor shows space between the items but the front end doesn't show any change.

Expected Behavior

Expect the space between items to appear on the front end.

Current Behavior

There's no space between items that's shown in the editor on the front end.

Screenshots or screen recording (optional)

spacing.mov

Code snippet (optional)

No response

WordPress Information

5.8 + TT1 Blocks

Gutenberg Information

11.2.1

What browsers are you seeing the problem on?

Chrome

Device Information

Desktop.

Operating System Information

MacOS

[jasmussen]

I can't reproduce this. Looking at the video (thank you!) the issue appears to have been the same issue where the navigation margin between items would collapse entirely, which was fixed by #33021. That bug would likely have affected the space-between option as well.

Are you able to test the latest plugin version to see if this was fixed?

[annezazu]

Thanks for digging in, Joen! I just tested this 11.3 and am still able to replicate. Perhaps I'm confused by the expected outcome? Would love your further insights:

space.between.mov

Of note, you'll notice a separate documented issue where the save prompt doesn't consistently get triggered: #30515

[jasmussen]

Thanks for the added test instructions! The key bit was having few menu items, and I believe #34258 fixes it.