I have made a tooltip that appears upon hovering an icon.
Can i use transitions to fade in the tooltip? Because I can’t get in to work.
Here is my code:
.tooltip{
display: inline;
position: relative;
}
.tooltip:after{
opacity: 0;
transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out;
}
.tooltip:hover:after{
background: #555;
bottom: 60px;
color: #fff;
content: attr(data-title);
left: -110px;
padding: 10px 15px;
position: absolute;
z-index: 98;
width: 220px;
font-size: .7em;
letter-spacing: 1px;
text-align: center;
opacity: 1;
}