vaadin-menu-bar-overlay acts strange with a "inline-size" container

[danielvanmil]

Description

When we use a Vaadin component that uses a vaadin-menu-bar-overlay in a container of type "inline-size" that uses container queries, the overlay acts strange. This only happens in latest Firefox and not in Chrome/Edge

Expected outcome

I would expect the overlay to act consistent and correct in all browsers.

Minimal reproducible example

See https://vaadin.com/docs/latest/example?path=component/menubar/menu-bar-basic.ts

Steps to reproduce

How to test:

• Navigate to https://vaadin.com/docs/latest/example?path=component/menubar/menu-bar-basic.ts
• Open the developer tools
• Select the first HTML child element of the body (id="___gatsby") and add the style property "container-type: inline-size" to the element
• Open some menu bar items

Expected: all menus act normal in FireFox
Actual: some menus close immediately when opened in FireFox, Chrome/Edge act normal

Could this be a FireFox issue and if so, could you pinpoint how this could be caused? (or add a workaround in the Vaadin components?)

Environment

Vaadin version(s): 24.4.11
OS: Windows

Browsers

No response