Status & feedback / A little more context
Tooltip
A CSS hint for the longer explanation behind an abbreviation or short label.
Basic usage
A lower bound describes what was determined, not a guaranteed total.
HTML
<p>A <span class="hint" tabindex="0" data-dd-hint="Analysis stopped early. The actual count may be greater.">lower bound</span> describes what was determined, not a guaranteed total.</p>Classes & attributes
| Class / attribute | Purpose |
|---|---|
.hint | The text that carries a hint. |
data-dd-hint | The supplementary explanation. |
tabindex="0" | Makes the hint reachable by keyboard. |
.tooltip-end | Anchors the tooltip to the right when it is near an edge. |
Usage notes
Never put essential information only in a tooltip. Keep the meaning in the body for touch users and readers who do not hover.
Examples follow your system color scheme. Use ◐ in the header to try automatic, light, and dark themes.