Tooltipsv4.x

Tooltips provide contextual information on mouse-over.

To add a tooltip to any element, add the attributes of data-toggle="tooltip" and data-placement="[top|bottom|left|right]". The title attribute holds the content title="Tooltip content here".

Bootstrap 4.x | Tooltips

I'm a big fan of Neko Case!

I'm a big fan of Neko Case — Have a listen and you will be too.

Who is Neko Case?

<p>I'm a big fan of <strong data-toggle="tooltip" title="tooltip at right" data-placement="right">Neko Case!</strong></p>

<hr>

<p>I'm a big fan of <a href="https://www.youtube.com/watch?v=6zpqDgbUa1Y" target="_blank" data-toggle="tooltip" title="Tooltip at top" data-placement="top" style="font-size: inherit">Neko Case</a> — Have a listen and you will be
  too.</p>

<hr>
<p>Who is Neko Case? <i class="fa fa-fw fa-info-circle bright-blue" aria-hidden="true" data-toggle="tooltip" title="Tooltip at bottom" data-placement="bottom"></i></p>
<hr>
<button type="button" class="btn btn-primary" data-toggle="tooltip" data-placement="left" title="Tooltip on left" onclick="window.open('https://www.youtube.com/watch?v=cU3xh55g5yY&list=OLAK5uy_kJoRmVrgIzm3ddLne3hdRY8tiAKC8mUyM&index=1');">Watch Neko Case Videos</button>