Tooltip Best Practices | CSS-Tricks
Briefly

Tooltips are used to provide simple text hints for UI controls, appearing when users hover over or focus on an unnamed control like the bell icon.
A 'tooltip' is a non-modal overlay containing text-only content that provides supplemental information about an existing UI control, hidden by default.
It's critical that tooltips provide only descriptive text. If you’re thinking of adding interactive content, you should be using a dialog instead.
When using tooltips for labeling an icon, the aria-labelledby attribute should be used to properly associate it with its corresponding text.
Read at CSS-Tricks
[
|
]