Hola, tengo un tooltip personalizado de la siguiente forma:
<div align="center" style="OVERFLOW-y: auto; WIDTH: 100px; HEIGHT: 100px;"><a class="tooltip" href="#">Prueba<span>555555555</span></a></div>
Con el siguiente estilo:
Código:
a.tooltip { /*Propiedades del texto visible*/
position: relative; /* posición */
text-decoration: none ; /* Eliminamos el subrayado */
color:#000000 ; /* Cambiamos el color de texto */
font-weight:bold ; /* negritas al texto */
}
a.tooltip:hover
{/*Hace aparecer el cuadro*/
z-index:999; /* Definimos que este por encima de todo */
background-color: none; /* obligatorio definir color de fondo */
}
a.tooltip span { /* Ocultamos el elemento */
display: none;
}
a.tooltip:hover span { /*Propiedades del cuadro*/
text-align: left;
display: block; /* se muestra el cuadro */
position: absolute; /* posicion de cuadro */
top:2em; left:2em;
width:auto; /* ancho del cuadro */
padding:5px; /* la separación entre el contenido y los bordes */
background-color: #000000; /* color de fondo*/
color: #FFFFFF; /* color del texto */
}
Pero el tooltip me sale dentro con la barra desplegable y si el tooltip ocupa mas que el div pues no se ve.
Como podría hacer que el tooltip salga por encima del DIV?
Saludos y gracias.