Pure CSS Tooltips

32
53

In this lesson we go over how to make pure CSS tooltips. Tooltips are used on sites to display relevant information/more information on the item, element or link you are hovering on. This is…

source

32 COMMENTS

  1. this is a very good video but it doesnt show u how to make the triangle above the tooltip, here it is:
    .tooltip:hover span:before{
    border: 15px solid transparent;
    border-bottom 15px solid #535663;
    margin-top: -15px;
    }
    This aligns it to the center of the span, if u wanna change it to the left :
    margin-left: – 70px;
    change it to the right
    margin-right: 70px;

    please note this is only compatible with this video.

LEAVE A REPLY