Como hacer un Tooltip solo con CSS

Un tooltip es esa pequeña ventana emergente que sobre un texto aparece cuando colocamos la etiqueta title. La forma en que se presenta esta visualización no es manejable vía CSS.
Pero bien se puede mejorar la visualización recurriendo a la siguiente técnica.

HTML

 
<p>Hacer <a href="#" class="tooltip">un tooltip<span>Este efecto está hecho sólo con CSS</span></a> es más fácil.</p>

Código CSS

a:hover {
background: #FFFFFF;
text-decoration: none; 
/* background necesario para IE6 */
}
 
a.tooltip span {
display: none;
padding: 2px 3px;
margin-left: 8px;
width: 130px;
}
 
a.tooltip:hover span{
display: inline;
position: absolute;
background: #FFFFFF;
border: 1px solid #CCCCCC;
color: #6C6C6C;
}

Visto en CSS NO LANCHE