Buenas tardes:
Me gustaría saber si existe alguna técnica para que teniendo un botón
compuesto por 3 imágenes (izquierda, medio y derecha), se pueda aplicar el
efecto hover al botón completo. Tal y como lo tengo ahora:
.boton-wrapper{
float:right;
margin-top:5px;
}
a.boton-wrapper {
text-decoration:none;
color:#FFF;
}
.boton{
background:#DC002E url(../img/pixel-medio.gif) repeat-x 0 0;
height:16px;
float:left;
width:auto;
padding:5px 10px;
}
.boton-izda{
background:#DC002E url(../img/izquierda.gif) no-repeat 0 0;
height:26px;
width:4px;
float:left;
}
.boton-dcha{
background:#DC002E url(../img/derecha.gif) no-repeat 0 0;
height:26px;
width:4px;
float:left;
}
.boton:hover{
background:#DC002E url(../img/pixel_medioHover.gif) repeat-x 0 0;
}
.boton-izda:hover{
background:#DC002E url(../img/izquierdaHover.gif) no-repeat 0 0;
}
.boton-dcha:hover{
background:#DC002E url(../img/derechaHover.gif) no-repeat 0 0;
}
<a href="#" class="boton-wrapper">
<div class="boton-izda"></div>
<div class="boton">Entrar</div>
<div class="boton-dcha"></div>
</a>
El hover se aplica a cada uno de los divs de manera individual, cambiándose
de manera desigual el aspecto de botón.
Gracias
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
