css only tooltips using data attributes
the styles do not include any browser prefixes. to add them, run autoprefixer with postcss.
the styles do not include any z-index rules. you should add them to your own project in relation to other z-indices:
[class*=tooltip--]:before,
[class*=tooltip--]:after {
z-index: 10;
}to install: npm install --save data-tooltip
to use in css-land:
in your style sheet, just add @import 'data-tooltip and then run postcss-import
to use in markup-land:
<div class='tooltip--top' data-tooltip='this tooltip text will appear above this div when hovered over'>
Hover over me
</div>