Repository navigation
When there isn't space on top and below the block, the toolbar overlaps the block #38409
Description
Description
Working on woocommerce/woocommerce-blocks#5581 we noticed a strange behavior about the toolbar position: when there isn't space on top and below the block, the toolbar overlaps the block.
This behavior could generate a not optimal great experience (see image 2 and image 3).
I discovered that this use-case is handled here.
Maybe a related issue is #37076.
Step-by-step reproduction instructions
- Be sure that you have activated a block theme.
- Go to Appearance > Site Editor > Template Parts > Header.
- Click on the main block.
- Check the position of the toolbar.
Screenshots, screen recording, code snippet
Environment info
No response
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
Activity
nerrad commentedon Mar 17, 2022
A couple more examples:
Header template part focused in the context of the full index template with a block in the header selected:
Just the header template part with the same block selected:
cuemarie commentedon Mar 22, 2022
I ran into this issue as well and submitted it over in Automattic/wp-calypso#60971
Here's the recording I took that shows my experience trying to add/edit Social Icons within a Navigation Block, when editing just the header template part of my site (which is quite short):
153275238-3db375e8-323f-47a5-b012-1d14ff4b104c.mov
Gustavo-Hilario commentedon Jun 8, 2022
I have seen this a couple of times when working on FSE templates with customers.
Here is a screencast:
Screen.Capture.on.2022-06-07.at.19-07-21.mp4
cuemarie commentedon Jul 19, 2022
Looks like specifically the navigation block and overlapping toolbars is being discussed/worked on here: #40382
I'm not sure if this issue is the exact same, or a related issue but impacts other blocks as well, so leaving open for other to determine that.
nerrad commentedon Aug 7, 2026
I rechecked this against current trunk using the original isolated Header template-part scenario.
With a short Header canvas and the Site Title block selected, the block toolbar is now positioned above the block with the expected spacing and does not overlap it. I also added a focused local E2E check of the toolbar and block bounds; it passed.
The related positioning work in #42887 remains in the current implementation, although that PR explicitly fixed #41575 rather than this issue.
The original problem no longer reproduces, so I’m closing this as fixed.