no puede deshacerse de la línea de puntos en los enlaces de Firefox?
-
02-10-2019 - |
Pregunta
Tengo una lista completa de una IMG:
<ul>
<li><a href="#"><img src="test.png" /></a</li>
<li><a href="#"><img src="test.png" /></a</li>
<li><a href="#"><img src="test.png" /></a</li>
(...)
</ul>
Cuando les haga clic en Firefox, hay líneas de puntos (quién diablos inventó eso y por qué? Tan feo!).
quiero para deshacerse de ellos, pero de estilo "contornos", etc. no parece trabajo, he intentado todas las opciones a continuación:
#ul li img:active {
-moz-outline-style: none;
-moz-focus-inner-border: 0;
outline: none;
outline-style: none;
}
#ul li img:focus {
-moz-outline-style: none;
-moz-focus-inner-border: 0;
outline: none;
outline-style: none;
}
#ul li img a:active {
-moz-outline-style: none;
-moz-focus-inner-border: 0;
outline: none;
outline-style: none;
}
#ul li img a:focus {
-moz-outline-style: none;
-moz-focus-inner-border: 0;
outline: none;
outline-style: none;
}
Solución
Es necesario aplicar los estilos a la etiqueta <a>
(los dos últimos son reglas CSS mal porque usted ha puesto la etiqueta <a>
dentro <img>
.
Esto funciona para mí:
a:active,
a:focus {
outline: none;
-moz-outline-style: none;
}
O, por sólo dentro del elemento con ID ul
(no el mejor nombre, por cierto):
#ul a:active,
#ul a:focus {
outline: none;
-moz-outline-style: none;
}
Otros consejos
a:active,
a:focus {
outline: none;
-moz-outline-style: none;
}
funciona para mí en FF22
contornos: 0 debería hacerlo y debe ser aplicado sobre el elemento <a>
, que no es en realidad un niño de <img />
. <img />
es un hijo de <a>
por lo que su css debe decir:
#ul li a {
outline: 0;
}