v150 · HTML · Popover API

Tooltip over Menu

In Chrome 150, a popover=hint tooltip can remain visible while a popover=auto dropdown is open. Open a dropdown menu, then hover or focus the icon buttons to see a hint appear above the menu without closing it.

Checking popover support…

auto: closed

hint: closed

top-layer event log

key rules (Chrome 150)

Opening a popover=hint does not force-dismiss an already-open popover=auto
Opening a new unrelated auto still hides an already-open hint
Light-dismiss follows the active top-layer relationship instead of leaving orphaned hints
A hint sits above the auto stack in the top layer — tooltips are never hidden behind menus

code

<!-- Dropdown (auto) — light-dismisses and closes its stack -->
<button popovertarget="file-menu">File</button>
<div popover="auto" id="file-menu">…</div>

<!-- Tooltip (hint) — can open while an auto is open -->
<button aria-describedby="tip-bold">𝐁</button>
<div popover="hint" id="tip-bold">Bold (Ctrl+B)</div>

<!-- Chrome 150: show the menu first, then show the hint. -->

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗

key rules (Chrome 150)

code

see also

implementation reference