Fix submenu border visibility in Navigation block

[R1shabh-Gupta]

What?

Closes #70516

Fixes the visual clipping of submenus in the Navigation block when a menu item is focused via keyboard. Specifically, it resolves an issue where the bottom part of nested submenus was hidden.

Why?

When using the keyboard to navigate a nested menu (e.g., via the Tab key), the browser displays a focus outline on the menu item. In many default themes (including Emptytheme), the bottom portion of the focused submenu was being clipped, making it inaccessible or visually broken.

How?

Added z-index: 1 to the .wp-block-navigation-item__content class to ensure that submenu containers are correctly layered above surrounding elements, preventing clipping and making the keyboard focus outline fully visible.

Testing Instructions

1. Open a post or page editor.
2. Insert a Navigation block.
3. Add a nested menu structure (at least two levels deep).
4. Save and preview the page on the front end.
5. Use the Tab key to navigate into the menu and focus a submenu item.

Testing Instructions for Keyboard

1. Use Tab key to focus into the top-level menu.

2. Continue tabbing into the submenu.

3. Observe that:

   • Focus ring appears correctly.
   • Entire submenu content (including bottom items) remains visible.
   • No parts are visually cut off.

Screenshots or screencast

Emptytheme

Twenty Twenty-Two

Twenty Twenty-Three

Twenty Twenty-Four

Twenty Twenty-Five

[github-actions]

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @R1shabh-Gupta! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

[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: R1shabh-Gupta <[email protected]>
Co-authored-by: t-hamano <[email protected]>

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

[t-hamano]

LGTM! I think this is the simplest and best approach.