Foros del Web - IMG no subrayada

Foros del Web (http://www.forosdelweb.com/)

- CSS (http://www.forosdelweb.com/f53/)

- - IMG no subrayada (http://www.forosdelweb.com/f53/img-no-subrayada-413522/)

monorendon

31/07/2006 11:33

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"> Administración de Grupo de Usuarios </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???

monorendon

31/07/2006 11:54

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

webosiris

31/07/2006 12:03

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}

GoRaK

31/07/2006 12:19

Cita:

Iniciado por monorendon

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

Cambio lo que tienes por:

<a href="paginita" title="algo"><img src="/images/utils/Users.png" title="algo" alt="algo" style="border:0;"/> Administración de Grupo de Usuarios </a>

monorendon

31/07/2006 12:56

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...

webosiris

31/07/2006 13:02

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.

monorendon

31/07/2006 13:30

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....

monorendon

31/07/2006 18:35

Acaso nadie sabe como resolver este problema??

webosiris

31/07/2006 18:57

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)

monorendon

31/07/2006 19:36

Pues hombre, dejame decirte que tampoco funciona...

webosiris

31/07/2006 19:41

pasa entonces el enlace a ver...

monorendon

31/07/2006 20:02

que enlace???

webosiris

31/07/2006 20:20

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 ;

monorendon

31/07/2006 20:26

pues no...

jesusbet

31/07/2006 20:32

<A href="paginita"><IMG style="text-decoration: none; border: 0" border="0" src="/images/utils/Users.png"> Administración de Grupo de Usuarios </A>

NopalStudio

31/07/2006 23:41

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;

}

monorendon

01/08/2006 10:22

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"> Administración de Grupo de Usuarios </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????

MaXaC

01/08/2006 10:51

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>

monorendon

01/08/2006 11:04

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...

ePorroa

01/08/2006 11:28

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

monorendon

01/08/2006 13:04

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 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...

ePorroa

01/08/2006 14:09

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

GoRaK

01/08/2006 16:49

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;"> Administración de Grupo de Usuarios </a>

Saludos!

La zona horaria es GMT -6. Ahora son las 23:42.