Css estilos en vínculos

En html
Tengo un menú acordeón el cual los botones tienen estilo de color gris y cambio de color al rojo al estar "sobre", eso se editó en una hoja css aparte que el DW crea por defecto por elmenu, el asunto es que en IE las imágenes que tienen vínculos se le agrega solo un borde de color gris :/ y la idea es que sean imágenes sin ese borde de vinculo :(

4

4 respuestas

Respuesta
1

¿Podes subir el menu a algun directorio en la web como para verlo?... asi es mas facil!

http://signo0.cl/duplex/index.html

el menu no es el problema si, el problema son las imágenes (logo) que como son vínculos se les crea ese marco así :/

Si, el tema es que tendrias que estar usando un reset de los estilos para homogeneizarlo lo mas posible entre navegadores desde lo basico. El que usamos aca es http://github.com/necolas/normalize.css

Con eso le decis que de entrada use eso, y despues le sume tus estilos. Es una manera de lograr un "estandar" entre los navegadores. Con eso deberia irse todo problema de esa indole.

Sino, simplemente pone en el CSS externo:

img {border: 0 none;}

Eso andaria tambien.

Pero te recomiendo veas lo del reset.

Cualquier cosa me decis!

Abrazo!

al final cree un estilo para las imágenes,, y le agregue el mismo color que el fondo, y le puse !important

y así ya no se ven los bordes en IE

entonces pensé que la solución era !important después le puse al estilo de las imágenes

img {
color: !important;
text-decoration:none !important;
border:0 !important;
outline:none !important;
}

pero no resultó :(

al final si le pongo el mismo color visualmente no se ve, pero el borde sigue existiendo :/ :/:/

Probalo asi

img {
border: 0 none !important;
outline: none;
}

Ponelo arriba del todo en la hoja... TIENE que andar, yo lo hice con el Firebug sobre tu modelo, el que me pasaste y anduvo!

OJO: otra cosa es si te pone el borde al <a>... aca estamos hablando de IMG... si el estilo lo ves en el <a> deberias ponerle los estilos a ese elemento!

Por ejemplo: viendo el CSS de tu pagina desde IE, veo que los objetos <a> (por ejemplo el logo de arriba del todo a la izquierda) cuando esta como "visited", tiene un borde colorado o algo asi...eso NO ES LA IMG, sino el <a>. Deberias colocarle el estilo que quieras a todas las pseudoclases que necesites... ejemplo:

a:visited {los estilos que necesites;}

a:hover {lo que sea;}

... y demas pseudoclases!

Tene en cuenta esto ultimo, porque lo probe en el IE y se fue cuando, en el "a:visited" le puse "color: transparent"... obviamente usando lo primero de la IMG, que le quita los bordes a TODAS las IMG!

Este tipo de cosas las solucionas seguro con el reset... son problemas tipicos de que cada navegador renderiza a su placer!

Proba y me decis que tal!

Abrazo!

Respuesta
1

Bueno en el famoso "IE", siempre tendrás problemas al momento de desarrollar, lo que tienes que hacer, es crear una clase para esas imágenes que tienen links, o trata de ponerle el color de fondo, así no se nota que tienes color.

a.link-img{

color:#FFFFFF; ////Esto depende del fondo de la pagina

text-decoration:none; ///Esto es para no subrayar el texto

border:0;

}

Entonces con esa clase puedes agregarla a el link de tu imagen

<a href="#" class="link-img"><img src="img-1.jpg"/></a>

Con eso no debería tener problemas :D

si también pensé que serviría, ingrese los códigos y clase :/

mira ahí esta el código

http://signo0.cl/duplex/index.html

así como aparte,,, la botonera de arriba esta en flash, en IE me cambia el tamaño en opera se ve perfect como quiero :/

Debes agregar la clase a el hipervínculo y a la imagen que tienes dentro para no tener problemas.

¿Eres Chileno?

Saludos! Si no resulta seguimos buscando respuestas :)

@JuanGarciaR

de maipu xd

puse esto así

<a href="enlace.html" class="link-img"><img src="logo.jpg" class="link-img">

y no se modifica

a:link

a:visited

a:active

uno de esos manda más, pero na que ver que me agarre las imágenes igual.

¿Tienes skype o gmail o algo así para conversar mas fluido?

Listo, mande invitación! :)

Respuesta
1

Revisa que tienen el borde o el padding a cero, porque a veces el IE es un poco "particular!"... sin ver el código es difícil ayudarte.

Respuesta
1

Tendrías que agregar al css un border: 0; de manera que al tratar IE esa imagen el propio CSS le impida poner un borde.

Lo mejor es que lo hagas en la propia capa (div) del CSS

Generalmente empiezan por # o por punto si son sub clases.

Si necesitas ayuda para identificarlo me comentas y lo miramos.

al final cree un estilo para las imágenes,, y le agregue el mismo color que el fondo, y le puse !important
y así ya no se ven los bordes en IE
entonces pensé que la solución era !important después le puse al estilo de las imágenes:
img {
color: !important;
text-decoration:none !important;
border:0 !important;
outline:none !important;
}
pero no resultó :(
al final si le pongo el mismo color visualmente no se ve el borde pero sigue existiendo :/ :/: /

Si le pones "border 0px !important;" NO debería de aparecer ese borde, ya que le estas dando borde 0.

¿La tienes colgada para poder verla?

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas