Hola gente,
Acerca de esas cajitas que aparecen al clicar sobre otras, y que se mantienen no visibles hasta ese momento me ocurre lo siguiente. Bueno, primero los datos:
XHTML:
<div><a href="#" class="deploy">Blah<span>Blah blah blah</span></a>
<div>
<a href="#" class="deploy">Blah<span>Blah blah blah</span></a><br />
</div>
</div>
CSS:
.deploy {
width: 150px;
height: 40px;
background-image: url(../images/azul.jpg);
position: relative;
display: block;
z-index: 0;
text-decoration: none;
text-align:center;
padding: 10px;
color: #000;
cursor:hand;
margin-top:15px;
}
.deploy:hover {
z-index: 1;
color:#000000;
}
.deploy span {
padding: 10px;
position: absolute;
text-decoration: none;
background-color: #CCCCCC;
color: #3E1F00;
text-align:justify;
width: 545px;
visibility: hidden;
border: groove #000000;
}
.deploy:active span, .deploy:focus span {
visibility: visible;
top: -10px;
left: 200px;
}
Decía que me ocurre lo siguiente:
Cuando clico en cualquiera de ellas, no importa en qué posición de la página estén, me remiten a la parte superior del documento, es decir, como si pulsase un <a href="#header">Volver arriba</a> o algo así, no sé si me explico.
Por ejemplo, esas dos cajitas así solas, van estupendamente, pero cuando hay muchas más, o cuando coloco otro contenido entre ellas y las separo en vertical, al clicar sobre la inferior me sube a la superior... curioso.
Help?