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

ClassAttribute
tooltip-{ top, bottom, left, right }data-tooltip
tooltip-inlinedata-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.