✔ Kleiner grauer Rand nach Klick auf ein Bild

[Comenius]

Guten Morgen,

jeder kennt ja diesen kleinen grauen Rand, der - zumindest in meinem Firefox - nach einem Klick auf ein Bild erscheint.

Nun meine Frage: kann man diesen Rand mit CSS bearbeiten, bzw ganz verschwinden lassen?

Danke

Gruss
Commi

 

[Maik]

Sprichst du von der gepunkteten Umrandung, die beim Klicken eines Links bzw. Grafik-Links erscheint?

Meines Wissens lässt sie sich nicht mit CSS editieren bzw. deaktivieren, hierfür wäre dann eher Javascript erforderlich:

<a href="#" onfocus="this.blur()"><img src="" alt="" border="0"></a>

 

[Steffen Giers]

Die gepunktete Linie kann man für Firefox ohne JS mit

a { outline: none; }

entfernen. Allerdings nimmt man dem User so die Möglichkeit mit der Tab-Taste zu Navigieren. Das ist im Sinne der Barierefreiheit und der Zugänglichkeit aber nicht! zu empfehlen.

 

[Gumbo]

Dieser gepunktete Rand stellt den aktuellen Fokus dar und ist wichtiger Bestandteil der Benutzerführung. Ihn zu entfernen ist ein massiver Eingriff in die Bewegungsfreiheit des Benutzers. Es ist damit vergleichbar, als würde man die Navigation mit der Maus verbieten.

 

[Comenius]

hmmmm....

Ich habe eine Navigation mit kleinen Grafiken und deshalb sieht es nicht so toll aus, wenn nach jedem klick auf einen Link dieser Rahmen erscheint.

Aber najut, das mit der Einschränkung ist natürlich ein stärkeres Argument.

Trotzdem danke

Gruss
Commi

 

[Steffen Giers]

Wenn du einfarbige Grafiken hast könntest du zum Bleistift

a {outline-color:#fff}

schreiben um so die Farbe der Punkte anzupassen. Zumindest kannst du es so unaufälliger gestalten. So wird dem die User die Möglichkeit dieser Navigation nicht genommen.

Geht auch als Shorthand

a {outline: 5px invert #fff;}

 

[Comenius]

Nein, leider nicht.
Der Rand geht genau durch zwei von drei Farben in meinem Button bzw. Link.

Naja, was will man machen ?

Danke euch trotzdem.

Gruss
Commi

 

[Steffen Giers]

Dann versuche doch die Outline bzw. den Link mittels einer width und height Angabe zu gestalten. So kannst du den gepunkteten Rand des Links an den der Grafik anpassen.