Hola.
Tengo el siguiente problema con los thumbnails de mi sitio. Al pasar el mouse sobre ellos aparece el nombre de la imagen sobre un fondo negro; pero estoy aparece en la parte superior y me gustaría que aparezca en la parte inferior así:
Este es mi codigo css:
Código PHP:
<style type="text/css">
* {
border-width: none;
margin: 0;
padding: 0;
}
.over {
height: 228px;
overflow: hidden;
position: relative;
width: 304px;
}
.over span.tooltip {
display: none;
}
.over:hover span.tooltip {
background-color: #000000;
color: #FFFFFF;
display: list-item;
float: left;
font-family: Helvetica;
font-size: 10pt;
font-weight: bold;
left: 0;
padding-bottom: 10px;
padding-top: 10px;
position: absolute;
text-align: left;
text-transform: uppercase;
top: 0;
width: 304px;
z-index: 10;
}
body, html {
height: 100%;
width: 100%;
}
</style>
</head>
<body>
<div class="over">{thumbnail}
<span class="tooltip">{image_name}</span></div>
</body>
</html>
Saludos!!