Tooltip

Tooltips provide context information labels that appear on hover and focus.When using icons for actions you can use a tooltip to give people clarification on its function.Astral Tooltips component is built entirely in CSS.

Add the tooltip class and the data-tooltip attribute, which contains the tooltip content, to non self closing elements.

And add the tooltip-right, tooltip-bottom or tooltip-left class to define the position of a tooltip. By default, the tooltip appears above the element.

bottom tooltip

top tooltip

left tooltip

right tooltip