Skip to content

Right-edge first-level submenu is displaced beside its parent with Left container alignment #4573

Description

@pirate-bot

Summary

On desktop, a first-level Primary Menu dropdown near the right edge of the viewport can become horizontally separated from its parent when Submenu Container Alignment is set to Left. The dropdown is expected to remain attached below its parent while opening into available viewport space. Instead, it can be positioned beside the parent, creating a pointer gap that prevents users from reaching submenu links.

Customer context

  • Product / area: Neve theme with Neve Pro, Header Builder Primary Menu submenu positioning
  • Version: Exact versions not provided; reported as appearing roughly two months before August 2026
  • Environment: Desktop frontend; custom CSS removed and other plugins deactivated during troubleshooting
  • Integration / third party: Neve Pro submenu controls; LiteSpeed cache was present but the issue remained after plugin-isolation checks
  • Reported error / symptom: A right-edge submenu opening left is separated from its parent menu item
  • Impact: The affected submenu cannot be reliably navigated with a pointer

Reproduction notes

Reported workflow:

  1. Use Neve with Neve Pro active and a desktop Primary Menu containing a parent item near the viewport's right edge.
  2. Set Primary Menu > Layout > Submenu Container > Container Alignment to Left.
  3. Open the parent item's submenu on the frontend.
  4. Observe the submenu opening toward the left but separated horizontally from its parent, leaving a pointer gap.

The customer reports that deactivating Neve Pro removes the symptom, while deactivating other plugins, removing custom CSS, resetting layout settings, and replacing the Primary Menu component do not. Staff identified changing Container Alignment to Right as a workaround. No local browser reproduction was run; confirmation is based on the transcript and definite geometry in the inspected code paths.

Diagnosis

Conclusion

The defect is confirmed by repository inspection. Neve's viewport correction selects every .sub-menu and, when an LTR dropdown overflows the right edge, assigns right: 100%; left: auto. That geometry is suitable for a nested flyout but places a first-level dropdown beside its parent. Neve Pro's Left container alignment sets right: auto, making first-level right-edge overflow more likely; the reported Right-alignment workaround avoids that branch in the inspected scenario.

The customer's approximate two-month regression window is not supported by local history. The interacting positioning behavior predates current releases.

Where this likely occurs

  • Desktop Primary Menu viewport correction: assets/js/src/frontend/navigation.jsrepositionDropdowns() lines 31–67. Lines 33–35 select all submenu depths, while lines 50–53 apply right: 100% without distinguishing first-level dropdowns from nested flyouts.
  • Core menu geometry: assets/scss/components/elements/navigation/_nav-menu.scss.nav-ul .sub-menu and nested .sub-menu selectors lines 84–109. First-level dropdowns default below the parent with right: 0; nested flyouts use left: 100% and top: 0.
  • Neve Pro control mapping: includes/modules/header_footer_grid/submenu/customizer/component_settings.phpComponent_Settings::add_sm_layout_settings() lines 333–410. The control maps Right to 0, Left to auto, and publishes the value as --alignment for submenu elements.
  • Neve Pro emitted CSS: includes/modules/header_footer_grid/submenu/submenu.phpSubmenu::get_submenu_style() lines 279–290 and 378–380. The rule emits right: var(--alignment) for .nav-ul .sub-menu at all depths.
  • History: Neve commit 515c6098a introduced inward-opening viewport logic in June 2021; 5a0abc906 established the current inline side assignments in July 2021. Neve Pro commit 6cf60f18 introduced the container-alignment control in September 2022. Neve commit 8faab8cb1 added the post-adjustment geometry calculation and transform fallback in December 2023. No relevant navigation-positioning change was found around June 2026.

Engineering notes

The failure involves an interaction between Neve core's generic frontend positioning and Neve Pro's submenu alignment value. The Pro rule explains the trigger, while the lateral displacement is produced by the core positioning branch. Mobile sidebar styles explicitly unset desktop absolute positioning, so the inspected defect is scoped to desktop navigation. The same function also retains inline side and transform values across later calculations; whether that contributes independently in additional layouts was not runtime-verified.

Test coverage status

No relevant coverage was found during inspection for repositionDropdowns(), desktop right-edge geometry, or the Pro sm_container_alignment setting. e2e-tests/specs/customizer/hfg/hfg-menu-item-alignment.spec.ts lines 5–34 covers mobile item text alignment, not submenu-container geometry. Neve Pro's e2e-tests/specs/mega-menu/mega-menu.spec.ts lines 336–402 checks desktop mega-menu visibility and mobile opening behavior but does not assert attachment to the parent or viewport-edge positioning.

What to verify or explore next

  • May be worth reproducing at desktop widths with a first-level parent near the right viewport edge and Container Alignment set separately to Left and Right.
  • May be worth comparing first-level dropdown and nested-flyout bounding rectangles before and after repositionDropdowns().
  • If reproducible, checking LTR and RTL behavior could clarify whether both directional branches are affected.
  • Relevant validation surfaces are the Neve frontend Rollup bundle and the Neve/Neve Pro Playwright header-menu suites.

Unknowns / follow-up

  • The exact affected Neve and Neve Pro versions were not provided.
  • The HelpScout attachment could not be retrieved through the sanctioned image tool, so no screenshot geometry was available.
  • The reported timing may reflect a saved setting change, cache state, or another release interaction rather than introduction of the inspected positioning logic.

Confidence

Confidence: 93/100

Repository inspection shows that Neve applies nested-flyout positioning to every submenu, including first-level dropdowns; the Pro Left alignment exposes this path near the viewport edge. The transcript's workaround matches the inspected geometry, and no existing GitHub issue was found in either Neve repository.


Source: HelpScout #3412666342
Generated by bug-report-triage (ID: bug-report-triage_6a777cc9b30e00.16769234)

Metadata

Metadata

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions