Eliminare i bordini dei link attivi di Firefox

Link e bordi Finendo un lavoro con un cliente mi è stato segnalato che su Firefox comparivano alcuni strani bordini sui link. Questi diventavano particolarmente anti-estetici nella barra del menù (cliccate sull’immagine per vedere meglio l’esempio) dove è stata usata la tecnica text-indent per il riposizionamento delle immagini.

Cercando come risolvere il problema ho scoperto che dipende tutto dalle impostazione di usabilità del panda rosso. La soluzione è quindi molto semplice (anche se fa perdere la validità del CSS).

Dovete aggiungere all’interno del vostro foglio di stile il seguente codice

:-moz-any-link:focus { outline: none; }

questo forza il browser a sovrascrivere le impostazioni di default contenute in path/to/firefox/res/ua.css che prevedono appunto la comparsa del bordo dotted di un pixel quando si clicca col mouse.

via sonspring

ciuaz

4 Comments

  1. Se vuoi mantenere la validità del CSS ti consiglio di scrivere la regola dentro un document.write di Javascript, contenuto nella head. Dovrebbe funzionare.

  2. io in genere in progetti che non necessitano di particolari accorgimenti di usabilità utilizzo semplicemente
    a:focus { outline: 0; }

  3. ok funziona perfettamente con firefox, ma come si può ottenere lo stesso risultato con internet explorer?

Comments are closed.

%d bloggers like this: