Foros del Web » Creando para Internet » CSS »

IMG no subrayada

Estas en el tema de IMG no subrayada en el foro de CSS en Foros del Web. Hola, alguien me puede ayudar con esto??? Tengo un hipervínculo que es imagen y texto, pero no quiero que la imagen se me subraye, estoy ...
  #1 (permalink)  
Antiguo 31/07/2006, 12:33
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
IMG no subrayada

Hola, alguien me puede ayudar con esto??? Tengo un hipervínculo que es imagen y texto, pero no quiero que la imagen se me subraye, estoy haciendo así:

<A href="paginita"><IMG src="/images/utils/Users.png"><br>Administración de Grupo de Usuarios<br></A>


La palabra está bien que se subraye pero no la imagen, cuando el mouse no esta encima no pasa nada, pero cuando el mouse pasa por encima de la imagen, pues esta se subraya junto con el texto, lo que quiero que ocurra es que se subraye el texto solamente, sin subrayarse la imagen.... como hago eso???? me imagino que se lo puede arreglar con CSS verdad???
  #2 (permalink)  
Antiguo 31/07/2006, 12:54
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
Segun yo el problema lo estoy teniendo es apartir de esto:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HTML LANG="en">

Porque sin eso, no hay problema y la imagen no se subraya con CSS que aplica que no tenga text decoration, pero con ese DTD hace que se subraye.... como soluciono eso

PD: no puedo quitar ese

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HTML LANG="en">

tiene que estar de obligacion
  #3 (permalink)  
Antiguo 31/07/2006, 13:03
Avatar de webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.727
Antigüedad: 15 años, 10 meses
Puntos: 997
Cita:
Iniciado por monorendon
tiene que estar de obligacion
si, eso no se puede quitar... y además el que pones está incompleto. Debería decir
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Ahora, si nos mostraras el css que tenés sería más fácil... probá a agregar a tu CSS
Código:
a img {text-decoration:none}
__________________
Pasamos tus PSD a HTML

Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. -
  #4 (permalink)  
Antiguo 31/07/2006, 13:19
 
Fecha de Ingreso: julio-2005
Mensajes: 220
Antigüedad: 12 años, 4 meses
Puntos: 0
Cita:
Iniciado por monorendon

<A href="paginita"><IMG src="/images/utils/Users.png"><br>Administración de Grupo de Usuarios<br></A>
Cambio lo que tienes por:

<a href="paginita" title="algo"><img src="/images/utils/Users.png" title="algo" alt="algo" style="border:0;"/><br/>Administración de Grupo de Usuarios<br/></a>
  #5 (permalink)  
Antiguo 31/07/2006, 13:56
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
ok my css es este:

BODY,A,TH,SELECT,INPUT,TEXTAREA,FONT,TD,H1,H2,H3,H 4,H5,H6 {
font: 11.5px tahoma, arial, sans-serif;
}

BODY {
margin: 0 0 0 0;
background: #FFFFFF;
color: #3d3d3d;
}

A IMG {
border: 0px;
text-decoration:none;
}

A:link,A:visited {
color: #000080;
text-decoration: none;
}

A:hover,A:active {
text-decoration: underline;
color: #ff4400;
}

SELECT,INPUT,TEXTAREA {
color: rgb(27, 25, 131);
font-size:11px;
}

FONT,TD,TH {
color: #3d3d3d;
}

Y no sirve como dices GoRaK, lo mismo que nada...
  #6 (permalink)  
Antiguo 31/07/2006, 14:02
Avatar de webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.727
Antigüedad: 15 años, 10 meses
Puntos: 997
hola, tenés un pequeño problema con la cascada y la herencia... lo que yo te dije ponelo DESPUÉS de
Código:
A:hover,A:active {
    text-decoration: underline;
    color: #ff4400;
}
ya que esto último lo sobreescribe y entonces claro, no funciona.

PD: acostumbrate a escribir todas las etiqeutas y atributos (a, img, h1..) en minúscula.
PD 2: por favor, disminuí tu firma, solo se permiten 4 líneas. Gracias.
__________________
Pasamos tus PSD a HTML

Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. -
  #7 (permalink)  
Antiguo 31/07/2006, 14:30
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
Perdón... no igual me sigue subrayando... Es como si no le hiciera caso a la clausula text-decoration: none;

Bueno, no se si este dato sirva, pero el <a> está dentro de un <td> y este dentro de varias tablas... y a la final dentro de un div llamado <main> el cual está contenido dentro del <body>, beno, espero que sirva esta info....

Última edición por monorendon; 31/07/2006 a las 14:39
  #8 (permalink)  
Antiguo 31/07/2006, 19:35
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
Acaso nadie sabe como resolver este problema??
  #9 (permalink)  
Antiguo 31/07/2006, 19:57
Avatar de webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.727
Antigüedad: 15 años, 10 meses
Puntos: 997
a lo que yo te dije, agregale !important.. así:
Código:
a img {text-decoration:none !important;}
Cita:
dentro de varias tablas.
No tiene que ver con tu problema pero ya que lo comentás... lee porque diseñar con tablas es estúpido (el título suena "fuerte" pero es una traducción bastante literal de un art. en inglés)
__________________
Pasamos tus PSD a HTML

Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. -
  #10 (permalink)  
Antiguo 31/07/2006, 20:36
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
Pues hombre, dejame decirte que tampoco funciona...
  #11 (permalink)  
Antiguo 31/07/2006, 20:41
Avatar de webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.727
Antigüedad: 15 años, 10 meses
Puntos: 997
pasa entonces el enlace a ver...
  #12 (permalink)  
Antiguo 31/07/2006, 21:02
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
que enlace???
  #13 (permalink)  
Antiguo 31/07/2006, 21:20
Avatar de webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.727
Antigüedad: 15 años, 10 meses
Puntos: 997
Cita:
Iniciado por monorendon
que enlace???
no lo tenés subido a algún lado para poder verlo online?

También probá a validar tu CSS, a ver si no te falta ningún ;
  #14 (permalink)  
Antiguo 31/07/2006, 21:26
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
pues no...
  #15 (permalink)  
Antiguo 31/07/2006, 21:32
Avatar de jesusbet
(Desactivado)
 
Fecha de Ingreso: mayo-2004
Ubicación: Monterrey, MX
Mensajes: 2.667
Antigüedad: 13 años, 7 meses
Puntos: 2
<A href="paginita"><IMG style="text-decoration: none; border: 0" border="0" src="/images/utils/Users.png"><br>Administración de Grupo de Usuarios<br></A>
  #16 (permalink)  
Antiguo 01/08/2006, 00:41
Avatar de NopalStudio  
Fecha de Ingreso: agosto-2005
Mensajes: 110
Antigüedad: 12 años, 4 meses
Puntos: 0
Hola monorendon

La respuesta a tu problema ya te la han dado, lo unico que voy hacer es resumirla;

1.- Debes agregar en tu img la opcion de border="0"
Código:
Ejemplo:
<img src="images/utils/Users.png" border="0">
2.- Debes cambiar en tu CSS la opcion de text-decoration: underline; por la siguiente text-decoration: none;
Código:
Ejemplo:
A:hover,A:active {
text-decoration: none;
color: #ff4400;
}
__________________
NopalStudio
Diseño y Desarrollo
Sitios en Alta Calidad
  #17 (permalink)  
Antiguo 01/08/2006, 11:22
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
mm... como que no se entiende... pero weno, me voy hacer explicar otra vez...

Lo que tengo es esto: un hipervínculo de la siguiente manera:

<A href="paginita"><IMG src="/images/utils/Users.png"><br>Administración de Grupo de Usuarios<br></A>

Ahora, mi CSS es este:

BODY,A,TH,SELECT,INPUT,TEXTAREA,FONT,TD,H1,H2,H3,H 4,H5,H6 {
font: 11.5px tahoma, arial, sans-serif;
}

BODY {
margin: 0 0 0 0;
background: #FFFFFF;
color: #3d3d3d;
}

A IMG {
border: 0px;
text-decoration:none;
}

A:link,A:visited {
color: #000080;
text-decoration: none;
}

A:hover,A:active {
text-decoration: underline;
color: #ff4400;
}

SELECT,INPUT,TEXTAREA {
color: rgb(27, 25, 131);
font-size:11px;
}

FONT,TD,TH {
color: #3d3d3d;
}

IMG {
border: 0px;
}

y tiene por encabezado HTML esto:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HTML LANG="en">

En ie me aparece así:

Imagen Click aqui para irse a no se donde...

Pero al cambio en Firefox me aparece así:

Imagen Click aqui para irse a no se donde...

con "Imagen" estoy haciendo referencia que allí está hubicada una imágen...

Lo que yo quiero es que en Firefox no se subraye la Imagen...

Ahora si... como hago eso????
  #18 (permalink)  
Antiguo 01/08/2006, 11:51
 
Fecha de Ingreso: abril-2005
Ubicación: Lima-Peru
Mensajes: 313
Antigüedad: 12 años, 7 meses
Puntos: 1
y si pruebas con esto, en vez de border 0 le pones none
Código:
<A href="paginita"><IMG style="text-decoration: none; border: none" src="/images/utils/Users.png"><br>Administración de Grupo de Usuarios<br></A> 
  #19 (permalink)  
Antiguo 01/08/2006, 12:04
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
No, se sigue subrayando... la única solución que encontrado a esto es eliminar esto:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HTML LANG="en">

Pero si lo elimino se me dañan otras cosas que hice... entonces no lo puedo eliminar... Ya dijo esto solo me ocurre en Firefox...
  #20 (permalink)  
Antiguo 01/08/2006, 12:28
Avatar de ePorroa  
Fecha de Ingreso: enero-2003
Ubicación: Lima
Mensajes: 100
Antigüedad: 14 años, 11 meses
Puntos: 0
Hola, podrias probar con esto.
Código:
span{
    text-decoration:underline;
}
a img, a{
    text-decoration:none;
}

<a href="paginita"><img style="border:0;" src="/images/utils/Users.png"><br><span>Administración de Grupo de Usuarios</span><br></a>
Agrego el span para poder aplicar el underline a este mas no a la imagen, seria bueno que actualices tu web :D (quizas a HTML 4.1 transitional) ..

Salu2
  #21 (permalink)  
Antiguo 01/08/2006, 14:04
Usuario no validado
 
Fecha de Ingreso: octubre-2005
Ubicación: En mi casita
Mensajes: 100
Antigüedad: 12 años, 1 mes
Puntos: 0
Es que no se que es el HTML 4.1 transitional y además no encuentro un manual como HTML 4.1 para tontos... jeje...

Pues bueno, tu solución es un poco más práctica... pero va a tocar incluir <span></span> a los que quiero que son vinculos se subrayen... he allí el gran problema... Pero ahora se me ocurre una mejor solución, que tal si es a la imagen que va dentro del span.... para que no se subraye??? jeje... es una opinión...

Última edición por monorendon; 01/08/2006 a las 14:11
  #22 (permalink)  
Antiguo 01/08/2006, 15:09
Avatar de ePorroa  
Fecha de Ingreso: enero-2003
Ubicación: Lima
Mensajes: 100
Antigüedad: 14 años, 11 meses
Puntos: 0
De todas formas creo que esta es la solucion que mas rapido podria hacer parar un dolor de cabeza :D

Salu2
PD: Mas sobre el elemento span.
http://webdesign.about.com/od/htmlta...ltags_span.htm
  #23 (permalink)  
Antiguo 01/08/2006, 17:49
 
Fecha de Ingreso: julio-2005
Mensajes: 220
Antigüedad: 12 años, 4 meses
Puntos: 0
En IE funciona como te había respondido antes. Pero en firefox parece que no hay solución posible. De todas formas puedes probar con algún "truquillo" bajando un poco la imagen de manera que oculta el borde.

<a href="paginita" title="algo"><img src="/images/utils/Users.png" title="algo" alt="algo" style="display:block;margin-bottom:-3px;"><br/>Administración de Grupo de Usuarios<br/></a>

Saludos!
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:09.