[Ovillo] Evitar background-color en las imágenes
Hola,
cómo podría evitarse que esto:
a {
color: #06c;
text-decoration: none;
}
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
conllevara que las img incluidas entre a hicieran un fondo de
color en el hover.
Salu2
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
Yo no entiendo muy bien cual es tu duda...
¿Quieres que las imágenes dentro del link tengan el color de fondo
especificado en el hover?
-Mensaje original-
De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
En nombre de Terradillos Gutiérrez Carlos
Enviado el: jueves, 10 de abril de 2008 19:06
Para: Ovillo, la lista de CSS en castellano
Asunto: [Ovillo] Evitar background-color en las imágenes
Hola,
cómo podría evitarse que esto:
a {
color: #06c;
text-decoration: none;
}
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
conllevara que las img incluidas entre a hicieran un fondo de
color en el hover.
Salu2
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
Creo que es al contrario, evitar que tengan el fondo de color.
Ramon Lapenta
[EMAIL PROTECTED]
El 10/04/2008, a las 12:13 p.m., Joseba escribió:
Yo no entiendo muy bien cual es tu duda...
¿Quieres que las imágenes dentro del link tengan el color de fondo
especificado en el hover?
-Mensaje original-
De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
]
En nombre de Terradillos Gutiérrez Carlos
Enviado el: jueves, 10 de abril de 2008 19:06
Para: Ovillo, la lista de CSS en castellano
Asunto: [Ovillo] Evitar background-color en las imágenes
Hola,
cómo podría evitarse que esto:
a {
color: #06c;
text-decoration: none;
}
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
conllevara que las img incluidas entre a hicieran un fondo de
color en el hover.
Salu2
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente
dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
a:hover img {
color: #D3E2E7;
text-decoration: none;
background-color:none;
}
Prueba añadiendo eso
Terradillos Gutiérrez Carlos escribió:
Hola,
cómo podría evitarse que esto:
a {
color: #06c;
text-decoration: none;
}
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
conllevara que las img incluidas entre a hicieran un fondo de
color en el hover.
Salu2
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
Si no entiendo mal lo que querés lograr es que cuando una imagen esté dentro
de un a no tenga el efecto de hover.
De ser así, lo que tenés que hacer es definir un estilo a img (debajo de
esos estilos que ya definiste) para que luego un estilo pise al otro y anule
el efecto del fondo.
Saludos,
Javier Trejo
Diseñador Web
JT - Comunicación Interactiva
www.cominteractiva.com.ar
Cel.: +54 (11) 15 6485-7734
Mail: [EMAIL PROTECTED]
MSN: [EMAIL PROTECTED]
Skype: trejo.javier
-Mensaje original-
De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
En nombre de Terradillos Gutiérrez Carlos
Enviado el: Jueves, 10 de Abril de 2008 14:06
Para: Ovillo, la lista de CSS en castellano
Asunto: [Ovillo] Evitar background-color en las imágenes
Hola,
cómo podría evitarse que esto:
a {
color: #06c;
text-decoration: none;
}
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
conllevara que las img incluidas entre a hicieran un fondo de
color en el hover.
Salu2
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
Sí, ya imagino que tengo que darle un estilo a img específico en es
contexto, o sea, dentro de a, pero ese es el problema, que nada
funciona...
El 10/04/2008, a las 20:37, Javier Trejo escribió:
Si no entiendo mal lo que querés lograr es que cuando una imagen
esté dentro
de un a no tenga el efecto de hover.
De ser así, lo que tenés que hacer es definir un estilo a img
(debajo de
esos estilos que ya definiste) para que luego un estilo pise al otro
y anule
el efecto del fondo.
Saludos,
Javier Trejo
Diseñador Web
JT - Comunicación Interactiva
www.cominteractiva.com.ar
Cel.: +54 (11) 15 6485-7734
Mail: [EMAIL PROTECTED]
MSN: [EMAIL PROTECTED]
Skype: trejo.javier
-Mensaje original-
De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
]
En nombre de Terradillos Gutiérrez Carlos
Enviado el: Jueves, 10 de Abril de 2008 14:06
Para: Ovillo, la lista de CSS en castellano
Asunto: [Ovillo] Evitar background-color en las imágenes
Hola,
cómo podría evitarse que esto:
a {
color: #06c;
text-decoration: none;
}
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
conllevara que las img incluidas entre a hicieran un fondo de
color en el hover.
Salu2
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente
dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
Gracias Hari,
none no es un valor correcto para background-color, podría ponerse
transparent que es su valor por defecto pero ni en un caso ni en
otro me funciona. Ni siquiera funciona con !important.
¿...?
El 10/04/2008, a las 20:32, Hari Seldon escribió:
a:hover img {
color: #D3E2E7;
text-decoration: none;
background-color:none;
}
Prueba añadiendo eso
Terradillos Gutiérrez Carlos escribió:
Hola,
cómo podría evitarse que esto:
a {
color: #06c;
text-decoration: none;
}
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
conllevara que las img incluidas entre a hicieran un fondo de
color en el hover.
Salu2
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente
dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente
dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
Hola, la mejor solución sería definir una clase distinta a los enlaces que tengan imágenes, siempre si es posible. En el caso contrario... me encontré hace tiempo con este problema y no logré solucionarlo del todo. El problema es que no se pueden definir estilos distinto al elementos dependiendo de lo que contienen... yo al final tuve que usar otros efectos para el hover (ej. el típico underline). La única manera de que no se vea el color de fondo del hover es que la imagen no tenga transparencias y que el enlace no deje espacios (padding por ejemplo) alrededor de la imagen. Es fácil decirlo, pero yo no logré implementarlo :( No sé si te he ayudado o no... espero haber entendido bien tu problema. Salu2 Tamara ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
A ver,
concreto más el tema:
Lo que tengo y creo que sería correcto es lo siguiente:
a {
color: #06c;
text-decoration: none;
}
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
img {
text-decoration: none;
border: none;
}
a:hover img {
background-color: transparent !important;
}
Pero no funciona, pero lo curioso del tema es que el background-
color que se ve en el hover no corresponde a las img, sino más
bien a una franja mucho más pequeña.
De hecho si añado:
img:hover {
background-color: #99FF00 !important;
}
me aparecen los dos background-color: el del a:hover y el del
img:hover
¿...?
El 10/04/2008, a las 19:05, Terradillos Gutiérrez Carlos escribió:
Hola,
cómo podría evitarse que esto:
a {
color: #06c;
text-decoration: none;
}
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
conllevara que las img incluidas entre a hicieran un fondo de
color en el hover.
Salu2
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente
dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
Me parece que ya he encontrado el pequeño misterio. La cosa está en que img ,por defecto, es un elemento en línea y por tanto el a:hover es algo que contiene en línea a las imágenes. Por tanto, lo que se ve en el a:hover no es el background-color de la img sino simplemente de la línea en la que está metida (de hecho tiene el line-height que defino por defecto y no la altura de la img). Para evitar esto se trataría de definir las img como bloques mediante display: block. Yo normalmente defino de entrada las img como bloques para evitar estas perrerías pero en este caso se trataba de una hoja de estilos heredada y no he caído en la cuenta... Salu2 El 10/04/2008, a las 23:37, Tamara Forza escribió: Hola, la mejor solución sería definir una clase distinta a los enlaces que tengan imágenes, siempre si es posible. En el caso contrario... me encontré hace tiempo con este problema y no logré solucionarlo del todo. El problema es que no se pueden definir estilos distinto al elementos dependiendo de lo que contienen... yo al final tuve que usar otros efectos para el hover (ej. el típico underline). La única manera de que no se vea el color de fondo del hover es que la imagen no tenga transparencias y que el enlace no deje espacios (padding por ejemplo) alrededor de la imagen. Es fácil decirlo, pero yo no logré implementarlo :( No sé si te he ayudado o no... espero haber entendido bien tu problema. Salu2 Tamara ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Evitar background-color en las imágenes
Hola,
Lo que pasa es que al hacer el hover sobre el enlace se aplican los dos
estilos que has definido, para el enlace y imagen:
a:hover {
color: #D3E2E7;
text-decoration: none;
background-color:#FF3366;
}
a:hover img {
background-color: transparent !important;
}
Pero no funciona, pero lo curioso del tema es que el background-
color que se ve en el hover no corresponde a las img, sino más
bien a una franja mucho más pequeña.
Esto es lo que me ocurría a mi :S Se me mostraba parte del color hover del
enlace, una pequeña franja abajo o a la derecha de la imagen (dependiendo
del navegador).
La única manera que encontré de solucionarlo era de ponerle un display:block
al enlace:
a {
display: block;
/* los demás estilos */
}
pero por supuesto esto no me valía para los enlaces que estaban embebidos
dentro de algún texto ya que al ser un block se van a la línea siguiente.
Por tanto pienso que no hay solución que valga para enlaces de tipo texto y
de tipo imagen. Lo mejor sería poner una clase distinta a los enlaces (si se
puede). Ejemplo:
a:hover.texto {
background-color: #FF3366;
}
a:hover.imagen {
background-color: transparent;
}
Un saludo,
Tamara
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
