RSS
Twitter
FacebookCSS: Corregir la línea punteada fuera de lugar en los enlaces
abr 26
CSS CSS, diseño web, errores, tips 3 Comments
Este será un tip rápido para corregir la línea punteada fuera de lugar en los enlaces y botones. El error lo he visto en Firefox aunque desconozco si también aparece en otros navegadores
La línea que se ve arriba, llamada outline, no debería ser tan extensa. Este error ocurre cuando a través de CSS queremos ocultar el texto de un elemento enviándolo lejos del área visible con text-indent. En el código de abajo se puede ver el text-indent a –9999em (lo enviaron muy lejos jeje).
Para corregirlo solo hay que añadir una regla más al CSS: overflow:hidden;
Con esto la línea se ajusta de nuevo al elemento porque ya no “busca” al texto fuera del área visible.
Otros temas
- 10 años después: marquee
- Carpetas: cada diseño en su lugar
- Diseño web al 100%: cerca, pero todavia no
abr 26, 2009 @ 14:29:10
Se supone que con outline:none; es suficiente no? :S
abr 26, 2009 @ 14:58:16
@elias: Lo he intentado con a:active{outline:none;} y con a:focus{outline:none;} pero ninguna de las dos formas me ha funcionado.
Personalmente no me importa que se vea, solo me molesta que se vea fuera de lugar.
abr 26, 2009 @ 22:21:43
el outline te sirve cuando navegas con el teclado y te marca que enlace es el que estás “seleccionando”, por eso no habría que usar outline:none (si es que funciona).
Personalmente yo prefiero no usar text-ident para nada, porque webkit aveces pela cables :S Regularmente agrego un <span> con el que oculto el texto. De todas formas, overflow:hidden es una buena “practica”, gracias por el tip.