Tooltips

Tooltip

Add your text to a data-tooltip attribute on any item you want to provide with a tooltip.

Demo

hover me!

Markup

<div data-tooltip="Tooltip goes here!">
  <!-- Content goes here! -->
</div>

Class

Class Attribute
tooltip-{ top, bottom, left, right } data-tooltip
tooltip-inline data-tooltip

If you want to use a tooltip with an icon, make sure to add the data attribute to the div wrapper instead! This will ensure the text does not render a different font.