CSS3 Tooltip

CSS3 Tooltip example

<style>
.tip{
width:20px;
height:20px;
background:#666;
float:left;
}

.tip:before{
content:attr(title);
display:none;
}

.tip:hover{
z-index:10;
position:relative;
}

.tip:hover::before{
width:150px;
display:block;
background:#eee;
border:1px solid #333;
padding:2px;
margin:5px 0 0 30px;
}
</style>
<div class=tip title='CSS3 Tooltip text'></div>