Hola,
Quiero hacer un efecto caption en una imagen, de forma que cuando pases el cursor sobre la imagen se muestre un texto en la parte de abajo.
Para ello muestro una estructura de la forma
Sin pasar el raton cambio la posicion del div contenido y le pongo display:none
Código CSS:
Ver original.contenido{
position: relative;
top: -130px;
display: none;
}
on hover
Código CSS:
Ver original#views-bootstrap-grid-1:HOVER .contenido{
top: -60px;
height: 60px;
z-index: 100;
display: inline;
}
El caso es que al pasar el ratón por encima se me muestra en la posición que yo quiero, pero me también me muestra la posición donde debería estar en el flujo normal del html su posición en blanco. Es decir, se muestra desplazado con la posición que doy en el top, pero además me muestra la posición que debería ocupar sin el desplazamiento.
¿Como puedo hacer que la posición normal del flujo html sin el relative no se muestre?
Muchas gracias